1

DataTable に以下のデータがあります。

| InvoiceNo |  Fruits   |     Date     | Description | Action |
---------------------------------------------------------------
|   001     |   Apple   | Jun 12, 2012 |      -      | Edit   |
|   001     |   Banana  | Jun 12, 2012 |      -      | Edit   |
|   001     |   Mango   | Jun 12, 2012 |      -      | Edit   |
|   002     |   Apples  | Jun 12, 2012 |      -      | Edit   |
|   002     |   Mango   | Jun 12, 2012 |      -      | Edit   |

列をクリックEditすると、 にある別の にデータが表示されます。すべての行が に表示されます。Edit click by で dataTableを持っていますが、dataTableのすべての行が に渡されます。もう一度、DataBase からではなく DataTable からデータを取得したいと思います。何か助け...ActionDataTableDialog ModalDataTableInvoiceNoDialog Modals DataTablefilteredInvoice NoDialog Modal DataTable

4

2 に答える 2

2

確かにここに行きます、これをデータテーブルの初期化コードとともに準備ができているドキュメントに追加します(ソースhtmlセットアップが何であるかがわからないので、html要素を言い換えました)jquery 1.9を使用して

$(document).ready(function() {
    var passData ={}; //if you want the table array to be global

$(document).on("click", "#yourtableID tbody tr #edit", function(){
    var nTr = this; 
    var aPos = oTable.fnGetPosition(this);

    var aData = oTable.fnGetData(aPos); //if you want the table array to be local
    passData = aData;
    console.log(aData); //view console to see entire row object
    alert(aData['InvoiceNo']); //if your data is key:value
    alert(aData[1]); //if your table is without keys
}); 

モーダルの使用例を次に示します。ここではタイトルを設定しています

$( '#dialog-modal' ).dialog( 
  'option', 'title', passData['InvoiceNo']+' - '+passData['Fruit'] 
  ).dialog( 'open' );               
});
于 2013-06-13T13:35:49.697 に答える
0

これは、別の AJAX 呼び出しを実行せずに、データ テーブルからダイアログにデータを渡すために使用される基本的なモーダル ダイアログの初期化です。注: open 関数を機能させるには、ページに TableTools.js を含める必要があります。

$("#your-dialog-id").dialog({
    autoOpen: false,
    modal: true,
    resizable: false,
    width: 450,
    buttons: {
        Cancel: function() {
            $(this).dialog("close");
        }
    },
    open: function() {
        var aVariable = TableTools.fnGetInstance('yourDataTableName').fnGetSelectedData()[0];

        $(this).find("input[name=input1]").val(aVariable.INVOICE_NO);
        $(this).find("input[name=input1]").val(aVariable.FRUITS);
        $(this).find("input[name=input2]").val(aVariable.DATE);
        $(this).find("input[name=input3]").val(aVariable.DESCRIPTION);
        $(this).find("input[name=input3]").val(aVariable.ACTION);
    }
});

このダイアログを開くには、次のようにします。

$("#yourDataTableName tbody").on( 'dblclick', 'tr:not(:has(td.dataTables_empty))', function (e) {
        TableTools.fnGetInstance('yourDataTableName').fnSelect(this);
        $("#your-dialog-id").dialog("open");
});
于 2014-07-02T18:49:52.323 に答える