jquery-datatables - 設定 - jquery datatables 大量データ




DataTables警告:行 '0'のデータソースから不明なパラメータ '0'が要求されました (8)

DataTablesウェブサイトから:

DataTablesの各セルはデータを要求し、DataTablesがセルのデータを取得しようとすると、それができなくなった場合、予期した場所でデータが利用できないことを知らせる警告が表示されます。 警告メッセージは次のとおりです。

DataTables警告:テーブルID = {id} - 行{row-index}未知パラメータ ' {parameter} 'が要求されました

ここで:

{id}は、エラーを引き起こしたテーブルのDOM idに置き換えられます

{parameter}は、DataTablesが要求しているデータパラメータの名前です

{row-index}は、エラーをトリガしたrwoのDataTables内部行インデックスです。

そのため、DataTablesは指定された行のデータを要求しました。 {parameter}はデータが存在しないか、またはnullまたはundefinedです。

詳細については、このDataTables Webサイトのテクニカルノートを参照してください。

誰もが知っている、以下の非常に単純なHTMLファイルで何が間違っていますか?

私はDataTableのデータソースとしてオブジェクトの配列を使用しようとしています:

tests.html:

<html>
<head>
<link type="text/css" rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css">
<link type="text/css" rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.2/css/jquery.dataTables_themeroller.css">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.2/jquery.dataTables.min.js"></script>
<script type="text/javascript">

var data = [
    {"Name":"UpdateBootProfile","Result":"PASS","ExecutionTime":"00:00:00","Measurement":[]},
    {"Name":"NRB Boot","Result":"PASS","ExecutionTime":"00:00:50.5000000","Measurement":[{"TestName":"TOTAL_TURN_ON_TIME","Result":"PASS","Value":"50.5","LowerLimit":"NaN","UpperLimit":"NaN","ComparisonType":"nctLOG","Units":"SECONDS"}]},
    {"Name":"NvMgrCommit","Result":"PASS","ExecutionTime":"00:00:00","Measurement":[]},
    {"Name":"SyncNvToEFS","Result":"PASS","ExecutionTime":"00:00:01.2500000","Measurement":[]}
];

$(function() {
        var testsTable = $('#tests').dataTable({
                bJQueryUI: true,
                aaData: data,
                aoColumns: [
                        { mData: 'Name' },
                        { mData: 'Result' },
                        { mData: 'ExecutionTime' }
                ]
        });
});

</script>
</head>
<body>

<table id="tests">
<thead>
<tr>
<th>Name</th>
<th>Result</th>
<th>ExecutionTime</th>
</tr>
</thead>
<tbody>
</tbody>
</table>

</body>
</html>

更新:私は、より新しいバージョンのDataTablesを使用する、またはmDataの名前をmDataPropに変更するという著者の回答を得ました。


knockout.bindings.dataTables.jsを使用している場合は、ファイルを編集してこの行を置き換えることができます

dataTable.fnAddData(unwrappedItems);

〜と

if (unwrappedItems.length > 0) {
    dataTable.fnAddData(unwrappedItems);
}

これは私を助け、あなたを助けることを願っています。


あなたはオブジェクトの配列を使用しています。 代わりに2次元配列を使用できますか?

http://www.datatables.net/examples/data_sources/js_array.html

このjsfiddleを参照してください: http://jsfiddle.net/QhYse/ ://jsfiddle.net/QhYse/

私はこのような配列を使用し、それは正常に働いた:

var data = [
    ["UpdateBootProfile","PASS","00:00:00",[]] ,
    ["NRB Boot","PASS","00:00:50.5000000",[{"TestName":"TOTAL_TURN_ON_TIME","Result":"PASS","Value":"50.5","LowerLimit":"NaN","UpperLimit":"NaN","ComparisonType":"nctLOG","Units":"SECONDS"}]] ,
    ["NvMgrCommit","PASS","00:00:00",[]] ,
    ["SyncNvToEFS","PASS","00:00:01.2500000",[]]
];

編集してオブジェクトの配列を含める

この質問から、可能な解決策がありますjQuery DataTablesオブジェクトを使ってfnrender

このjsfiddle http://jsfiddle.net/j2C7j/はオブジェクトの配列を使います。 私は3つの空白の値でそれを埋めなければならなかったエラーを取得しないために - 最適未満、私は知っている。 fnRenderを使ってより良い方法が見つかるかもしれません。

var data = [
   ["","","", {"Name":"UpdateBootProfile","Result":"PASS","ExecutionTime":"00:00:00","Measurement":[]} ]

];

$(function() {
        var testsTable = $('#tests').dataTable({
                bJQueryUI: true,
                aaData: data,
                aoColumns: [
                        { mData: 'Name', "fnRender": function( oObj ) { return oObj.aData[3].Name}},
                        { mData: 'Result' ,"fnRender": function( oObj ) { return oObj.aData[3].Result }},
                        { mData: 'ExecutionTime',"fnRender": function( oObj ) { return oObj.aData[3].ExecutionTime } }
                ]
        });
});

これは1時間以上私を悩ませました。

dataSrcオプションとcolumn defsオプションを使用している場合は、それらが正しい場所にあることを確認してください。 私は、Ajax設定で列デフをネストしていて、それを理解するには時間がかかりすぎました。

これはいい:

これは良くない:

微妙な違いはありますが、脱毛の原因となるほど十分です。


列名が同じであることを確認してください。 大文字と小文字が区別されます ここでは、私の場合、私のモデルの列名が大文字になっているときにこのエラーが発生し、私はajaxリクエストのデータにすべての小文字を使用しました。

だから、私は列名を正確に既存のモデル名と同じ方法で一致させることによって解決しました。

DataTableバインディング

$("#Customers").DataTable({
            ajax: {
                url: "/api/customers/",
                dataSrc: ""
            },
            columns: [
                {
                    data: "Name",
                    render: function (data, type, customer) {
                        return "<a href='/customers/edit/" + customer.Id + "'>" + customer.Name + "</a>";


                    }

                },
                {
                    data: "Name"
                },
                {
                    data: "Id",
                    render: function (data) {
                        return "<button class='btn-link js-delete' data-customer-id=" + data + ">Delete</button>";
                    }
                }
            ]
        });

Web APIメソッド:

  public IEnumerable<Customer> GetCustomers()
        {
            return _context.Customers.ToList();

        }

私のモデル: -

 public class Customer
    {
        public int Id { get; set; }

        [Required]
        [StringLength(255)]
        public string Name { get; set; }        

        [Display(Name="Date Of Birth")]        
        public DateTime? BirthDate { get; set; }


        public bool isSubscribedToNewsLetter { get; set; }

        public MembershipType MembershipType { get; set; }

        [Display(Name="Membership Type")]
        [Required]
        public byte MembershipTypeId { get; set; }
    }

ここで私の場合、iamは列(Name、Name、Id)でデータテーブルを作成します。iamはテストする2番目の列名を複製します。


私の奇妙なシナリオでは、私は常に 'レンダリング'機能で値を返すわけではない別の列を持っていました。 return null私の問題を解決しました。


私は同じ問題を抱えていた。 私のケースでは、最後の列の後にコンマがありませんでした。 私の人生の30分を無駄にして、私は戻ってこない!


誰かが新しいDataTables(すばらしいbtwです)を使用していて、オブジェクトの配列を使用したい場合は、columnsオプションを使用して簡単に行うことができます。 これに関する優れた例については、次のリンクを参照してください。

オブジェクトの配列を持つDataTables

私はこれと過去2日間苦労しており、これで解決しました。 私は他のコードの理由で多次元配列に切り替えることを望まなかったので、このような解決策を探していました。





jquery-datatables