datatables從json對象變得'undefined'

我需要從按鈕的函數中獲取json對象的id。如果我嘗試直接訪問id，我得到undefined（不是錯誤/警告），但是如果我嘗試訪問該對象，我可以毫無問題地看到它（id和其餘數據）。datatables從json對象變得'undefined'

var table = $('#example').DataTable({ 
    serverSide: true, 
    dom: 'Bfrtip', 
    ajax: '/get?op=2', 
    columns: [ 
     { data: 'id' }, 
     // more columns 
    ], 
    buttons: [ 
     { 
      text: 'New', 
      action: function (e, dt, node, config) { 
       window.location.href = '/url?op=new' 
      } 
     }, 
     { 
      text: 'Modify', 
      action: function (e, dt, node, config) { 
       window.location.href = '/url?op=modify&id=' + dt.row({ selected: true }).id()) 
      }, 
      enabled: false 
     }, 
     { 
      text: 'Delete', 
      action: function (e, dt, node, config) { 
      }, 
      enabled: false 
     } 
    ], 
    select: true 
});

我可以訪問JSON對象這樣做：

alert(JSON.stringify(dt.row({ selected: true }).data())); 
// {"id":1,"key":"value","etc":"etc"}

這是工作，我可以看到該對象的警報。

alert(dt.row({ selected: true }).id()); // undefined 
alert(JSON.stringify(dt.row({ selected: true }).id())); // "undefined" 
alert(JSON.stringify(dt.row({ selected: true }).data()[0])); // undefined

這是行不通的，我可以看到undefined而不是alert中的整數。

我嘗試更多的東西，我甚至不記得，但沒有工作...

我到底做錯了什麼？

來源

2016-01-06 Chazy Chaz

我不明白你是如何選擇一行。我還沒有找到使用{selected：true}的示例。 – Bindrid

我沒有那樣做，有人給我的代碼作爲示例http://stackoverflow.com/questions/34573773/datatables-buttons-enable-disable-example-not-working/34573906?noredirect=1#comment56893128_34573906。你知道我如何從選定的行中獲取id值嗎？ –

@Bindrid什麼？ –

我想這是你正在嘗試做的。看看我的修改按鈕，這是我在你之後添加的按鈕。我使用的是extn，但是如果你的數據有一個id字段，你應該可以改變名稱來匹配。做了一些其他更改，以便在我的本地環境中運行，但是如果您在jsfiddle中設置或在本地進行操作，它應該可以工作。

注意：這裏假定一次只能選擇一行。

<!DOCTYPE html> 

    <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head runat="server"> 
     <title></title> 
     <link href="https://cdn.datatables.net/1.10.10/css/jquery.dataTables.min.css " rel="stylesheet" type="text/css" /> 
     <link href="https://cdn.datatables.net/buttons/1.1.0/css/buttons.dataTables.min.css" rel="stylesheet" type="text/css" /> 

      <link href="https://cdn.datatables.net/select/1.1.0/css/select.dataTables.min.css" rel="stylesheet" type="text/css" /> 
     <script src="//code.jquery.com/jquery-1.11.3.min.js" type="text/javascript"></script> 
     <script src="https://cdn.datatables.net/1.10.10/js/jquery.dataTables.min.js" type="text/javascript"></script> 
     <script src="https://cdn.datatables.net/buttons/1.1.0/js/dataTables.buttons.min.js" type="text/javascript"></script> 
     <script src="https://cdn.datatables.net/select/1.1.0/js/dataTables.select.min.js" type="text/javascript"></script> 
     <script type="text/javascript"> 

      var mydata = [ 
        { 
         "name": "Tiger Nixon", 
         "position": "System Architect", 
         "salary": "$320,800", 
         "start_date": "2011/04/25", 
         "office": "Edinburgh", 
         "extn": "5421" 
        }, 
        { 
         "name": "Garrett Winters", 
         "position": "Accountant", 
         "salary": "$170,750", 
         "start_date": "2011/07/25", 
         "office": "Tokyo", 
         "extn": "8422" 

        }]; 



      $(document).ready(function() { 

       $.map(mydata, function (item, key) { 
          item["DT_RowId"] = item["extn"]}); 

       var table = $('#example').DataTable({ 
        serverSide: false, 
        dom: 'Bfrtip', 
        data:mydata, 
        columns: [ 

       { "data": "name" }, 
       { "data": "position" }, 
       { "data": "office" }, 
       { "data": "extn" }, 
       { "data": "start_date" }, 
       { "data": "salary" } 
         // more columns 
        ], 

        buttons: [ 
         { 
          text: 'New', 
          action: function (e, dt, node, config) { 
           window.location.href = '/url?op=new' 
          } 
         }, 
         { 
          text: 'Modify', 
          action: function (e, dt, node, config) { 

           window.location.href = '/url?op=modify&id=' + dt.row({ selected: true }).id() ; 
          }, 
          enabled: true 
         }, 
         { 
          text: 'Delete', 
          action: function (e, dt, node, config) { 
          }, 
          enabled: false 
         }, 
         { 
          extend: 'selected', 
          text: 'Modify', 
          action: function (e, dt, button, config) { 
          var rw = dt.rows({ selected: true }).data()[0]; 
          window.location.href = '/url?op=modify&id=' + rw.extn; 
         } 

       } 

        ], 
        select: true 
       }); 
      }); 

     </script> 
    </head> 
    <body> 
     <form id="form1" runat="server"> 
     <div> 

      <table width="100%" class="display" id="example" cellspacing="0"> 
        <thead> 
         <tr> 
          <th>Name</th> 
          <th>Position</th> 
          <th>Office</th> 
          <th>Extn.</th> 
          <th>Start date</th> 
          <th>Salary</th> 
         </tr> 
        </thead> 
        <tfoot> 
         <tr> 
          <th>Name</th> 
          <th>Position</th> 
          <th>Office</th> 
          <th>Extn.</th> 
          <th>Start date</th> 
          <th>Salary</th> 
         </tr> 

        </tfoot> 
       </table> 
     </div> 
     </form> 
    </body> 
    </html>

來源

2016-01-06 05:43:02 Bindrid

謝謝！我只用了'var rw = dt.rows（{selected：true}）。data（）[0];'和alert（rw.id）;'事實證明'{selected：true} '實際上在工作！ –

您可以使用渲染屬性這樣

 "render": function (data, type, full, meta) { 

      var varName = full.varName; 
      return '<div>'+ varName +'</div>' //or whatever html you want to render  
    }

來源

2016-01-06 01:57:51

不，我需要從選定的行中獲取id值。 –

datatables從json對象變得'undefined'

回答

相關問題