1

特定の列のアイテムをリンクしようとしていますが、それぞれがidjson文字列とは異なるリンクになります。残念ながら、APIを使用してこれを行う方法を見つけることができません(APIを使用せずにこれを行う方法はたくさんあることを知っています)が、列からアイテムをリンクする方法を探しています(それぞれ特定のリンク付きid)。

これが私のコードです。getJSONサーバーからJSONを取得するために使用し、このJSONから次のようにテーブルにデータをロードします。

$.getJSON("http://url.from/method?parameter=foo&callback=?", function(data)
    {
        var total = 0;
        $("#table_body").empty();
        var oTable = $('#mytable').dataTable(
            {
                "sPaginationType" : "full_numbers",
                "aaSorting": [[ 0, "asc" ]]
            }); 

        oTable.fnClearTable();

        $.each(data, function(i, item) 
        {
            oTable.fnAddData(
                [
                    item.contact_name,
                    item.contact_email
                ]
            );
        });
    });

私がやりたいのは、行ごとに、contact_nameをその行にリンクすることです。これもJSONにあり、を使用してこのループid内でアクセスできます。$.eachitem.contact_id

DataTables APIを使用してこれを行う方法はありますか?はいの場合、私に説明して、これに役立つ優れたリソースを提供していただけますか?

OBS:JSONPを使用しています

ありがとう。


私の新しいコードで更新:

エラーは、クリックするとIDを取得することですが、$.eachループ内の行を処理しているため、クリックした行については、常にid最後に処理された行のIDを取得します。

var options = 
        {
            "sPaginationType" : "full_numbers",
            "aaSorting": [[ 0, "asc" ]],
            "aoColumns": [{
                "sTitle": 'Name',
                "sClass": "dtName",
            }, {
                "sTitle": 'Email',
                "sClass": "dtEmail",
            }, {
                "bVisible": false
            }],
        }

        var oTable = $('#table').dataTable(options); // Creates a new instance of the DataTable

        oTable.fnClearTable();

        $.each(data, function(i, item) 
        {

            oTable.fnAddData(
                [
                    item.contact_name , 
                    item.contact_email,
                    item.contact_id
                ]
            );

            var rowData = oTable.fnGetData(i); // fetch all the ids into this array
            $('#table tbody tr').click( function() 
            {
                window.location.href = "/panel/contacts/"+rowData[2];
            });
        });
4

1 に答える 1

2

それを試してみてください:

var options = {
    "sPaginationType" : "full_numbers",
    "aaSorting": [[ 0, "asc" ]],
    "aoColumns": [{
        "sTitle": 'Name',
        "sClass": "dtName",
    }, {
        "sTitle": 'Email',
        "sClass": "dtEmail",
    }, {
        "bVisible": false
    }],
}
var oTable = $('#mytable').dataTable(options);

このテーブルにはid列は表示されませんが、次のコードのように取得できます。

var rowData = oTable.fnGetData(rowNode);

また

var rowData = oTable.fnGetData(0); // for the first one

console.log(rowData[0]);

表示されていないため、jQueryでは取得できません。

編集済み:申し訳ありませんが、1つ忘れてしまいました。AddDataを使用するときに、item.contact_idを3番目の位置に配置します。

oTable.fnAddData([
    item.contact_name,
    item.contact_email,
    item.contact_id
]);

クリックイベントのIDを取得する場合は、次のようにします。

jQuery('#mytable tbody tr').live('click', function() {
    var selectedRow = oTable.fnGetData(this),
        url = "/yourUrl/" + selectedRow[2];

    window.location.replace(url);
});
于 2012-04-12T23:51:13.867 に答える