带有选中复选框的分页.复选框仅适用于当前分页页面.jQuery 数据表 [英] Pagination with selected check boxes. Checkboxes will only work on current pagination page. jQuery datatables
问题描述
我正在使用 jquery 数据表插件.
我只有一个简单的 html 表格布局.
<头><tr><th>Id</th><th>电子邮件</th><th>姓名</th><th>电话</th>第<第>个城市个<th>State</th><th>到达</th><th>出发</th><th>插入</th><th>检查</th></tr></thead><tr><td>301</td><td>电子邮件地址</td><td>测试</td><td></td><td></td><td></td><td>2011 年 7 月 14 日</td><td>2011 年 7 月 23 日</td><td>2011 年 4 月 12 日 07:05</td><td><input type="checkbox" name="selected[]" value="301" class="chkbox"/></td></tr><tr><td>300</td><td>电子邮件</td><td>测试</td><td></td><td></td><td></td><td>2011 年 9 月 2 日</td><td>2011 年 9 月 10 日</td><td>2011 年 4 月 11 日 12:01</td><td><input type="checkbox" name="selected[]" value="300" class="chkbox"/></td></tr>这是我的提交代码(只是临时的).
我的 javascript 将复选框映射到数组.
function test() {var values = $('input:checkbox:checked.chkbox').map(function () {返回 this.value;}).得到();控制台日志(值)；}
这是数据表代码
$(document).ready(function() {选择变量；var selectedOutput = '#selectedOutput';var 模板 = 'selectedTemplate';var submitButton = '#submitButton'var dTable = $('#contactsTable').dataTable({bJQueryUI":真，"sPaginationType": "full_numbers","bPaginate": 真,bLengthChange":真，bFilter":真，bSort":假，bInfo":真，bAutoWidth":假，bProcessing":真，"aoColumns": [{"bVisible": false },//保持id不可见空值，空值，空值，空值，空值，空值，空值，空值，空值]});
问题是，我无法跨页面进行复选框选择.该表有多个页面.如果我点击提交，它只会提交我所在的当前页面的复选框数组.
我希望这已经足够清楚了.我不确定发生了什么.感谢您的帮助.
解决方案 我想你可以看看 这个，它可能会解决您的问题.
这个例子可能对你有帮助，因为它似乎正是你的情况(这个例子使用 fnGetNodes()，而在另一个链接中解释了如何使用 fnGetHiddenNodes() 如果第一个函数不起作用): http://datatables.net/examples/api/form.html>
I'm using the jquery datatables plugin.
I have just a straight html table layout for it.
<table class="display" id="contactsTable">
<thead>
<tr>
<th>Id</th>
<th>Email</th>
<th>Name</th>
<th>Phone</th>
<th>City</th>
<th>State</th>
<th>Arrival</th>
<th>Departure</th>
<th>Inserted</th>
<th>Check</th>
</tr>
</thead>
<tbody>
<tr>
<td>301</td>
<td>email address</td>
<td>Test</td>
<td></td>
<td></td>
<td></td>
<td>July 14 2011</td>
<td>July 23 2011</td>
<td>April 12 2011 07:05</td>
<td><input type="checkbox" name="selected[]" value="301" class="chkbox"/></td>
</tr>
<tr>
<td>300</td>
<td>email</td>
<td>Test</td>
<td></td>
<td></td>
<td></td>
<td>September 02 2011</td>
<td>September 10 2011</td>
<td>April 11 2011 12:01</td>
<td><input type="checkbox" name="selected[]" value="300" class="chkbox"/></td>
</tr>
Here is my code for submit (just temp).
<input id="submitButton" type="submit" value="Submit" onclick="test()" />
And my javascript to map the checkboxes to an array.
function test() {
var values = $('input:checkbox:checked.chkbox').map(function () {
return this.value;
}).get();
console.log(values);
}
Here is the datatables code
$(document).ready(function() {
var selected;
var selectedOutput = '#selectedOutput';
var template = 'selectedTemplate';
var submitButton = '#submitButton'
var dTable = $('#contactsTable').dataTable({
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"bPaginate": true,
"bLengthChange": true,
"bFilter": true,
"bSort": false,
"bInfo": true,
"bAutoWidth": false,
"bProcessing": true,
"aoColumns": [
{"bVisible": false }, //keep the id invisble
null,
null,
null,
null,
null,
null,
null,
null,
null
]
});
The problem is, I can't do a checkbox selection across a page. The table has mutiple pages to it. If I click submit, it only submits the array of checkboxes for the current page I am on.
I hope this is clear enough. I'm not sure what is happening. Thanks for any help.
解决方案 i think you might have a look at this, it might solve your problem.
This example might be of help to you as it seems to be exactly your case (this one uses fnGetNodes(), while in the other link it is explained how to use fnGetHiddenNodes() if the first function doesn't work ): http://datatables.net/examples/api/form.html
这篇关于带有选中复选框的分页.复选框仅适用于当前分页页面.jQuery 数据表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
登录
关闭
扫码关注1秒登录
发送“验证码”获取
|
15天全站免登陆