jQuery BootgridはBootstrap上でのtableを多機能にするスクリプトです。jQueryに依存します。thにカスタムデータ属性を与える必要がありますが、tableをthの内容毎にソートしたり検索出来たり数が多い場合は行の表示数を限定してページネーションを付与したり、列をフィルタリングしたり、といった事が可能になります。動作デモもあるのでご興味のある方はご覧になってみては如何でしょうか。ライセンスはMIT。 jQuery Bootgrid
概要 いいなとおもったjsプラグイン。 多くのライブラリはjQuery, Bootstrapの使用を前提としています。 これからも見つかったら追記する予定。 基本 jQuery 公式 git Bootstrap 公式 git 機能 jQuery Validation Plugin バリデーションするプラグイン。 公式 git data-attributeでルールを管理したい場合 PJAX (defunkt) 非同期通信でページ遷移するプラグイン。 公式 git 日本語での解説はこちら デザイン AdminLTE Control Panel Template 管理画面用のプラグイン。 公式 git Material Design Lite マテリアルデザイン。Google製のプラグイン。 公式 git 要素 Google chart グラフを作成するGoogle製のプラグイン。 公式 git
auxiliary/rpage GitHub BootstrapでのPaginationのUIをレスポンシブ化する「rpage」 ページ幅と共に、PaginationのUIを拡大・縮小させられるjQueryプラグインです 意外とこの部分は対応が難しいせいか、レスポンシブ化が進化していないように思いますがこうしたプラグインが出てきたようです 関連エントリ BootstrapのDropdownメニューをよりリッチにすることができる「Bootstrap-dropselect」 Bootstrapのポップアップ機能を拡張できる「ggpopover.js」 BootstrapのDropdownメニューをホバーで開くように出来るプラグイン「bootstrap-hover-dropdown」 BootstrapでiOSアプリ風UIを作るBootstrapテーマ「Bootstrap iOS7」
HTML <table id="grid-basic" class="table table-condensed table-hover table-striped"> <thead> <tr> <th data-column-id="id" data-type="numeric">ID</th> <th data-column-id="sender">Sender</th> <th data-column-id="received" data-order="desc">Received</th> </tr> </thead> <tbody> <tr> <td>10238</td> <td>eduardo@pingpong.com</td> <td>14.10.2013</td> </tr> ... </tbody> </table> JavaScript $("#grid-basic")
TOTAL just start typing to edit, or move around with arrow keys or mouse clicks! About This tiny (3KB, < 120 lines) jQuery plugin turns any table into an editable spreadsheet. Here are the key features: No magic - works on a normal HTML table (so you can plug it in into any web table, and apply any JS function to calculate values) Supports validation and change events (so you can warn about invali
Treegrid jquery plugin デモ:TreeGrid for Bootstrap 3.0.x テーブルを折りたたみ可能なツリー型グリッドに変換できる「TreeGrid」。 Bootstrap3なサイトでも使うことができるようです。マークアップ上はただのテーブルですが、これを階層化して開閉できるUIは便利そうです。 こうしてますますBootstrapが強化されていって作り手としては嬉しい限りですね 関連エントリ Bootstrap3のテーマをWYSIWYGでカスタマイズ可能な「Bootstrap Magic」 BootstrapベースのフラットUI実装フレームワーク「Furatto」 Bootstrapのselectをカッコよくできる「Bootstrap-select」 BootstrapをベースとしたフリーのUIKit「Flat UI」 Bootstrapに270の使えるア
X-editableはBoostrapやjQuery/jQuery UIで使えるIn-place Editorです。 表示されている内容を編集する際にその場ですぐに編集できるようにするのがIn-place Editorです。それをBootstrap、jQuery UIなどに対応させたのがX-editableになります。 こんな感じでポップアップで編集できます。 エラー表示にも対応。 カレンダーでの入力。 選択式も可能です。 インラインで編集もできます。 こちらはjQuery UI版。 この場合も選択式などが使えます。 X-editableは単純な文字列入力の他に、選択やテキストエリアでの入力にも対応しています。入力チェックも可能で、エラーの際にそのまま表示を残せます。純粋なjQueryにも対応しているのでWebサービスに組み込んでみるのはいかがでしょう。 X-editableはJavaSc
jQuery Validationは名前の通り入力チェックを行うjQuery pluginです。サーバーサイドでチェックを行わないため画面遷移がなく、その場で入力ミスが分かるためユーザービリティーが上がります。 しかし、Twitter Bootstrapでデザインを組んでいると、エラー発生時に入力フォームが赤くならないため、以下のコードを追加します。 errorClass:'error', errorElement:'span', highlight: function (element, errorClass, validClass) { $(element).parents("div[class='control-group']").addClass(errorClass); }, unhighlight: function (element, errorClass, validCla
A preview of the jQuery UI Bootstrap themejQuery UI Bootstrap A Bootstrap-themed kickstart for jQuery UI widgets (v0.1) Welcome! This is a live preview of new the jQuery UI Bootstrap theme - a project I started to bring the beauty of Twitter's Bootstrap to jQuery UI widgets. With this theme, not only do you get the ability to use Bootstrap-themed widgets, but you can now also use (most) of Twitter
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く