jsGridはデータグリッドを実装する為の軽量スクリプトです。jQueryに依存しています。データテーブルのセル内のデータ編集やソート、ページングにも対応しています。スタイルコンポーネントのカスタマイズもし易いように設計したとの事。シンプルで良さ気です。ライセンスはMIT。 jsGrid動作サンプル
![データの編集やソート、ページングにも対応した軽量なデータグリッドを実装するスクリプト・「jsGrid」](https://cdn-ak-scissors.b.st-hatena.com/image/square/46c796cacac67433c7739858c8b3402cc830bf9d/height=288;version=1;width=512/http%3A%2F%2Fkachibito.net%2Fwp-content%2Fuploads%2F2015%2F05%2Fjsgrid01.jpg)
jsGridはデータグリッドを実装する為の軽量スクリプトです。jQueryに依存しています。データテーブルのセル内のデータ編集やソート、ページングにも対応しています。スタイルコンポーネントのカスタマイズもし易いように設計したとの事。シンプルで良さ気です。ライセンスはMIT。 jsGrid動作サンプル
I read about dragtable on ajaxian.com. It is a library-independent js-function that gives you the ability to re-order table columns by using drag'n'drop. This function does not exactly fulfill my needs. So I thought to myself 'Why not doing it the jQuery way?' And my next thought was like in Trash of the Titans 'Can't someone else do it?' I started google-ing and found nothing. So why not being th
jQuery UIを使ってテーブルをドラッグ&ドロップでソートできるようにする方法を紹介します。 テーブルをソートするには、jQuery UI Soatableを利用します。 1.基本 まず、jQueryのsoatable()を使ったテーブルのサンプルを示します。 サンプル サンプルのコード(抜粋)は次のとおりです。 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script> <script> $(function(){ $('tbody').sortable(); }); </script> <table> <thead> <tr> <
ウェブページでデータをみせるテーブルを見やすく、使いやすくするためのスタイルや機能性などUIパターンを紹介したアルティメットガイドをJanko At Warp Speedから紹介します。 Ultimate guide to table UI patterns 下記は各ポイントを意訳したものです。 テーブルの「(エクセルでいうところの)行と列」の表記は、「横列と縦列」に統一しています。 はじめに 1. 列を交互にスタイリング 2. 列をフルに 3. テーブルのセクション 4. ソート 5. フィルタリング 6. ページネーション 7. スクロール 8. 固定されたヘッダ 9. ヘッダのないテーブル 10. 拡張可能な列 11. 列のアクション 12. マルチプルな列のアクション はじめに テーブルは構造化されたデータをみせるものです。そして、その目的はデータを読みやすくし、走査しやすく、簡単
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く