我正在使用asp.net gridview和jquery dataTable。我在gridview中实现了jquery dataTable,如下所示:
<asp:GridView ID="gvCustomers" runat="server" AutoGenerateColumns="False" class="table table-striped"
Width="100%">
<Columns>
<%-- <asp:TemplateField>
<HeaderTemplate>
<asp:CheckBox ID="chkAll" runat="server"
onclick="checkAll(this);" />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="chk" runat="server"
onclick="Check_Click(this)" />
</ItemTemplate>
</asp:TemplateField>--%>
<asp:BoundField DataField="CustomerID" HeaderText="Customer ID" />
<asp:BoundField DataField="ContactName" HeaderText="Name" />
<asp:BoundField DataField="Country" HeaderText="Country" />
</Columns>
</asp:GridView>
我的java脚本如下:
<script type="text/javascript">
$(function () {
$('[id*=gvCustomers]').prepend($("<thead></thead>").append($(this).find("tr:first"))).DataTable({
"responsive": true,
"sPaginationType": "full_numbers",
"aoColumns": [
null,
null,
{ "bSortable": false }
]
});
});
</script>
我想在侧面gridview中添加一个带有标题复选框的复选框,用于检查所有功能。 Jquery dataTable不允许网格内的模板列。我需要检索复选框的值以进行删除。我还需要一个链接按钮来重定向到网格内的另一个页面。 感谢您的帮助。
编辑: 我编辑了我的javascript代码,如:
$(function () {
$('[id*=gvCustomers]').prepend($("<thead></thead>").append($(this).find("tr:first"))).DataTable({
columnDefs: [{
orderable: false,
className: 'select-checkbox',
targets: 0,
responsive: true,
sPaginationType: 'full_numbers'
}],
aoColumns: [{ "bSortable": false }, null, null, { "bSortable": false }]
});
});
现在我得到以下输出:
在加载过程中,我收到一条警告,例如&#34; DataTables警告:非表节点初始化(INPUT)。有关此错误的详细信息,请参阅http://datatables.net/tn/2&#34;但搜索,排序,分页工作正常。 有什么想法吗?
由于
帕塔
答案 0 :(得分:0)
首先,您的Gridview
标记没有错误,虽然格式不正确。我已经在我的计算机上本地测试了您的代码并取消了对TemplateField
代码的评论,因为复选框列基本上就是您要查找的内容。
问题在于您的DataTable
调用。我使用了以下简单的选择器#gvCustomers
,而不是你所拥有的,它没有你提到的错误。此外,确保您的aoColumns
数组长度与您拥有的列数相匹配是值得的。最后,在定义DataTable
选项时,我觉得不需要使用双引号。我们没有处理JSON,所以没有引用也没问题。希望这会有所帮助。
见下文:
$('#gvCustomers').DataTable({
columnDefs: [{
orderable: false,
className: 'select-checkbox',
targets: 0,
responsive: true,
sPaginationType: 'full_numbers'
}],
aoColumns: [null, null, { bSortable: false }, null],
select: {
style: 'os',
selector: 'td:first-child'
},
order: [[1, 'asc']]
});