Seita's programmer notes...: DataTables

ラベル DataTables の投稿を表示しています。すべての投稿を表示

2013年11月23日土曜日

jQueryでAjaxを使ったDataTableでちょっとハマったとこ

jQueryのDatableのプラグインで、Ajaxを使ってサーバーサイドからデータを取るページを作るのに若干ハマったとこをメモ書き。

ページでテーブルが表示されてから、何かのアクションを起こしてテーブルをサーバーサイドのデータで再描画する時、sEchoというパラメータに注意。あまり注意してなかったので、適当に1と設定していたのですが、これは描画リクエストがある度に更新してやらないと、クライアントサイドで再描画が起こらない。（キャッシュしてるのかな？）

という事なので、バックエンドではインクリメントをして返してやると、ちゃんとテーブルを描画してくれました。

string

sEcho

An unaltered copy of sEcho sent from the client side. This parameter will change with each draw (it is basically a draw count) - so it is important that this is implemented. Note that it strongly recommended for security reasons that you 'cast' this parameter to an integer in order to prevent Cross Site Scripting (XSS) attacks.

http://datatables.net/usage/server-side

2013年10月24日木曜日

jQueryのDataTablesを使うのに、どのCDNを使えば良いか？

jQueryのDataTablesで各種ウィジェットを隠すには？

$('#tableId').dataTable({

"bFilter": false,

"bInfo": false,

"bPaginate": false

});

http://datatables.net/usage/features

jQueryのDataTablesで必要なHTMLタグの前提条件

<table id="table_id">

    <thead>

        <tr>

            <th>Column 1</th>

            <th>Column 2</th>

        </tr>

    </thead>

    <tbody>

        <tr>

            <td>Row 1 Data 1</td>

            <td>Row 1 Data 2</td>

        </tr>

        <tr>

            <td>Row 2 Data 1</td>

            <td>Row 2 Data 2</td>

        </tr>

    </tbody>

</table>

※thead, tbodyが抜けててハマる事があるので注意。

http://datatables.net/blog/Getting_started_with_DataTables%3a_First_steps