3

AJAX ソースからデータを取得する DataTables テーブルがあります。私はテーブルを稼働させており、検索も機能しています。

ここで、すべての列に検索フィールドを実装してほしいというリクエストがありました。私が使用しようとした列フィルタリング用のDataTablesプラグインがあるようです。

これは私のHTMLです：

<!DOCTYPE HTML>
<html>
<head>
    <title>testpage</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js"></script>
    <script type="text/javascript" src="http://www.company.com/content/dam/workflows/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript" src="http://jquery-datatables-column-filter.googlecode.com/svn/trunk/media/js/jquery.dataTables.columnFilter.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
        $("#overview").dataTable({
            aoColumnDefs:[{
                aTargets: [0]
            }],
            bAutoWidth: false,
            bLengthChange: false,
            iDisplayLength: 10,
            sAjaxSource: "http://server/api.jsp?someparameters"
        }).columnFilter();
    })
    </script>
</head>

<body>

<table id="overview">
<tr>
    <thead>
        <th>#</th>
        <th>Betrieb</th>
        <th>Status</th>
        <th>Anlagenummer</th>
        <th>Bezeichnung</th>
    </thead>
</tr>
</table>

</body>
</html>

ご覧のとおり、columnFilter() メソッドを追加しただけです。コンソールにエラーをスローすることさえありませんが、テーブルは以前と同じように見えます (列を検索するための追加の入力ボックスはありません)。

私は何か間違ったことをしていますか？ソースがAJAXであるために可能ですか？

4

1 に答える 1

2

HTMLテーブルにフッターセクションを定義する必要があると思います。この例を見てください

テーブルは次のようになります

<table>
    <thead>
        <tr>...</tr>
    </thead>
    <tfoot>
        <tr>...</tr>
    </tfoot>
</table>
于 2013-04-05T12:32:51.687 に答える