2016-11-10 14 views
2

現在選択されている行の値を取得してURLに追加するDataTableの上部に編集ボタンを表示しようとしています。Jquery DataTableボタンをクリックして選択した行からデータを取得

私はそれが正常に動作するように管理しているが、私はどのように好きだっただろうか。

データテーブルに格納された値を取得するためにDatatableを適切に使用していない[マイ編集]ボタン。

$.fn.dataTable.ext.buttons.edit = { 
    text: 'Edit', 
    action: function() { 
     var assetID; 
     $("#example tr.selected").each(function (index, row) { 
      assetID = ($(row).find("td:nth-child(2)").html()); 
     }); 
     if (assetID != null) { 
      var url = "/Demo/Edit/" + assetID; 
      window.location.href = url; 
     } 
    } 
}; 

例現在選択されている行のデータをシャットアウトするテーブルを持つテーブルのDatatableサイトです。 私は自分のデータをより細かく、データテーブルの中に入れたいと思っています。

$(document).ready(function() { 
var events = $('#events'); 
var table = $('#example').DataTable({ 
    dom: 'Bfrtip', 
    select: true, 
    buttons: [ 
     "edit", //my edit button which works but requires external script 
     { // Example button from website. 
      text: 'Get selected data', 
      action: function() { 
       var count = table.rows({ selected: true }).count(); 
       //var count = table.rows({ selected: true }).data(); 
       // how do i then drill down into count to get value from column 2. 
       events.prepend('<div>'+count+' row(s) selected</div>'); 
      } 
     } 
    ] 
}); 
}); 

は、私が試してみて、DataTableのウェブサイトからの例内のオブジェクトにアクセスするには、非常に多くの方法を試してみましたが、私はちょうど価値に彼らの方法を使用して、選択した行の特定の列を取得することはできません。

ご協力いただければ幸いです。

+0

datatablesバックエンドを使用する必要がありますか、またはデータテーブル外でjqueryでハックすることはできますか?また、あなたはどのように '選択'されているか、addclassメソッドを持っていますか、DTに組み込まれていますか? DTを必要としない場合は、ロジック( '.selected')のようなものを実行し、ロジックのそれぞれ(...)をボタンにバインドするだけです。 – rob

答えて

0

は、私はいくつかの時間前にこれを解決しますが、ただ、これは未回答見つかったので、それならば、私は私の調査結果を投稿するだろうと思いました誰にでも助けます。

$.fn.dataTable.ext.buttons.edit = { 
    text: 'Edit', 
    action: function() { 
     var tableToQuery = $("#controllerTable").DataTable(); 
     var selectedRow = $("#controllerTable tr.selected"); 
      var rowdata = tableToQuery.row(selectedRow).data(); 
      var assetID = rowdata.AssetID; 
      if (assetID != null) { 
      var url = "/Demo/Edit/" + assetID; 
      window.location.href = url; 
     } 
    } 
}; 
0

私が残したコメントに先制の回答を投稿するだけです。関数を作成してバインドするためにデータテーブルを使わずにこれを行うことができれば、jqueryでそれを行い、独自のボタンを作ることができます。

唯一のことは、どのように「選択」されているのかわかりません。これはデータテーブルの一部です(私はDTをたくさん使いましたが、行を選択することはありません)?

いずれにしても、おそらく行にクラスが適用され、そのクラスを使用して選択することができます。

<button type="button" id="selected_action">Do It!</button> 


$('#selected_action').on('click', function(){ 
    $('selected').each(function(){ 
     parent_row = $(this).closest('tr'); 
     //use nth-child selectors on parent_row to get what you want 
     }) 
}) 

あなたはDataTableの内部であなたのボタンをレンダリングした場合は、しかしこのセレクタを使用します。

('#dc_{{dgroup.order}}_dlist tbody').on('click', '#selected_action', function(){...}); 
+0

フィードバックロブをありがとう、私のテーブルは、テーブルの外に1つのボタンがあります、私は役割を識別するために選択された行クラスを使用して現在動作している2番目の列からデータを取得しています。私は各行にボタンを持っていないので、画面のスペースを節約し、すべてのボタンをフォームの上に置いています。私はあなたの例が好きで、その行のボタンを使ってうまくいくでしょう。私は本当に私のコードよりもはるかにクリーンな例から、DataTableの既存の構造とモデルを使用したいと考えています。 –

関連する問題