在数据表的新行中添加按钮,变得未定义
Add button in a new row on datatable, getting undefined
我有一个javascript对象,我试图向数据表添加一个新行。一列是字段,另一列应包含按钮。
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, "" + obj.id + "")'>Delete</a>";
}
}).draw();
};
然后,当我单击"删除"按钮时,我在"id"值中得到"未定义"。我不知道为什么,因为当我初始化用初始数据填充它的表并以大致相同的方式使用"mRender"时,它的工作原理。
var deleteCategory = function(element, id) {
console.log(id);
//Blah blah, all the code to delete on backend and remove the row
};
我希望这可以有所帮助:
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, "" + obj.id + "")'>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>
感谢您的回复!我已经解决了。
若要初始化数据表,请按以下代码操作:
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, "" + data.id + "")'>Delete</a>";
}
}
]
});
最后,一切都解决了,只是以这种方式添加javascript对象。希望这能帮助更多的人。
var appendLastCategory = function () {
var obj = {
id: 'jh2i4h34ubi43',
name: 'Lolo',
};
$('#categoriesList').DataTable().row.add(obj).draw();
};
相关文章:
- 在 javascript 中返回未定义值的单选按钮
- 在数据表的新行中添加按钮,变得未定义
- 基本 webpack 不适用于按钮单击功能 - 未捕获的引用错误:未定义
- 单选按钮值传递在父页面中未定义
- 按钮单击“未定义”不是一个函数
- 单选按钮中的 ng 模型始终未定义
- 数据表:未捕获类型错误:无法读取未定义的属性“按钮”
- Dart 中的参考错误:按下按钮时未定义功能
- 为什么计数是(':checked')或 prop('checked') 单选按钮由 .length 返回未定义
- 尝试选择哪个单选按钮以及何时通过代码放置它返回未定义
- 离子类型错误:第一次单击保存按钮时无法读取未定义的属性“标题”
- 未定义动态 li 标签内按钮的 onclick 事件
- JavaScript函数未定义 单击按钮时出错
- 客户按钮 ckeditor 无法设置未定义的属性“名称”
- 单击按钮时未定义ClearInterval
- 点击“;加载“;按钮未触发事件,并且未定义LocalFileSystem
- “提交”按钮将值指定为“未定义”
- 来自文本框和单选按钮的用户输入在警报中重复,显示未定义
- Javascript单选按钮值返回未定义的值
- 图像按钮串联变量给出未定义的错误