添加按鈕在數據表的新行，得到undefined

我有一個javascript對象，我試圖添加一個新的行到數據表。一列是一個字段，另一列應包含一個按鈕。添加按鈕在數據表的新行，得到undefined

var appendLastCategory = function() { 
    var obj = { 
     id: 'jh2i4h34ubi43', 
     name: 'Lolo', 
    }; 
    $('#categoriesList').DataTable().row.add({ 
     name: obj.name, //First column 
     mRender: function() { //Second column 
      return "<a class='md-btn' onClick='deleteCategory(this, &quot;" + obj.id + "&quot;)'>Delete</a>"; 
     } 
    }).draw(); 
};

然後當我點擊「刪除」按鈕時，我在'id'值中獲得'undefined'。我不知道爲什麼，因爲當我初始化填充初始數據並使用'mRender'的表格時，它的工作原理基本相同。

var deleteCategory = function(element, id) { 
    console.log(id); 
    //Blah blah, all the code to delete on backend and remove the row 
};

來源

2016-03-19 Roberto Zuniga

在結果標記中，您是否可以確認生成的'onClick'屬性列出了id？即'deleteCategory（this，「jh2i4h34ubi43」）' –

我可以證實，即使我在代碼中刻錄'id'，它仍然顯示未定義。 –

我希望這能幫助：

var deleteCategory = function(element, id) { 
 
    alert(id); 
 
    //Blah blah, all the code to delete on backend and remove the row 
 
}; 
 
var appendLastCategory = function() { 
 
    var obj = { 
 
    id: 'jh2i4h34ubi43', 
 
    name: 'Lolo', 
 
    }; 
 
    $('#categoriesList').DataTable().row.add({ 
 
    '0': obj.name, //First column 
 
    '1': "<a href='#' class='btn btn-info' role='button' onClick='deleteCategory(this, &quot;" + obj.id + "&quot;)'>Delete</a>", 
 
    }).draw(); 
 
}; 
 

 
$(function() { 
 
    appendLastCategory(); 
 
});

<script src="http://code.jquery.com/jquery-1.12.1.min.js"></script> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 
 

 
<link href="http://cdn.datatables.net/1.10.11/css/jquery.dataTables.min.css" rel="stylesheet"> 
 
<script src="http://cdn.datatables.net/1.10.11/js/jquery.dataTables.min.js"></script> 
 

 

 

 
<table id="categoriesList" class="display" cellspacing="0" width="100%"> 
 
    <thead> 
 
    <tr> 
 
     <th>name</th> 
 
     <th>button</th> 
 
    </tr> 
 
    </thead> 
 
    <tfoot> 
 
    <tr> 
 
     <th>name</th> 
 
     <th>button</th> 
 
    </tr> 
 
    </tfoot> 
 
    <tbody> 
 
    <tr> 
 
     <td>Tiger Nixon</td> 
 
     <td>Tiger Nixon</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Garrett Winters</td> 
 
     <td>Tiger Nixon</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Ashton Cox</td> 
 
     <td>Tiger Nixon</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

來源

2016-03-19 19:04:02 gaetanoM

感謝您的答覆！我已經解決了。

要初始化數據表，這是下面的代碼：

var datax = [{ 
     id: '67i67i634r2r', 
     name: 'Lala', 
    },{ 
     id: 'g45y45y657t3', 
     name: 'Lele', 
    }]; 
$('#categoriesList').DataTable({ 
    "data": datax, 
    "columns": [ 
     { data: "name" }, { 
      render: function(o, type, data) { 
       return "<a class='md-btn' onClick='deleteCategory(this, &quot;" + data.id + "&quot;)'>Delete</a>"; 
      } 
     } 
    ] 
});

在最後一切都得到了解決只是增加這樣的JavaScript對象。希望這會幫助更多的人。

var appendLastCategory = function() { 
    var obj = { 
     id: 'jh2i4h34ubi43', 
     name: 'Lolo', 
    }; 
    $('#categoriesList').DataTable().row.add(obj).draw(); 
};

來源

2016-03-19 20:22:48

添加按鈕在數據表的新行，得到undefined

回答

相關問題