Jquery jqGrid上的prettyCheckable不起作用
我有一个jqGrid表,它使用多选复选框将表转换为网格。 为了自定义我使用的复选框样式,它为复选框输入生成一个标签和一个锚href和div容器,该复选框输入被标签和a隐藏和覆盖。我的问题是,当我检查标签时,标签不起作用,而当我检查输入时,标签起作用。 这是我的jqGrid设置:Jquery jqGrid上的prettyCheckable不起作用,jquery,html,css,checkbox,jqgrid,Jquery,Html,Css,Checkbox,Jqgrid,我有一个jqGrid表,它使用多选复选框将表转换为网格。 为了自定义我使用的复选框样式,它为复选框输入生成一个标签和一个锚href和div容器,该复选框输入被标签和a隐藏和覆盖。我的问题是,当我检查标签时,标签不起作用,而当我检查输入时,标签起作用。 这是我的jqGrid设置: $(document).ready(function() { $('#searchForm').ajaxForm(function() { var _data = $('#searchFo
$(document).ready(function() {
$('#searchForm').ajaxForm(function() {
var _data = $('#searchForm').serialize();
$('#ResultsTable').jqGrid().setGridParam({url: '${searchUrl}' + _data}).trigger("reloadGrid")
return true;
});
jsonTable('ResultsTable', 'ResultsPager', '${searchUrl}', 'searchForm',
{id: 'code'},
['Code', 'Description', 'CF'],
[{name: 'code', index: 'code', width: 55},
{name: 'description', index: 'description', width: 90},
{name: 'CF', index: 'CF', width: 80},
function(id) {
var selRows = $(this).jqGrid('getGridParam', 'selarrrow');
$('#edit').toggle(selRows.length == 1);
$('#delete').toggle(selRows.length > 0);
$('#editForm #code').val(selRows);
$('#deleteForm #code').val(selRows);
},
function(aSel, selected) {
$('#edit').toggle(false);
$('#delete').toggle(selected);
if (selected) {
$('#editForm #code').val(selRows);
$('#deleteForm #code').val(selRows);
}
},
true
)
});
为什么这不起作用
另外,我已经编辑了prettyCheckable.js并删除了,因此不会生成。我将css从.prettycheckbox a{}重命名为.prettycheckbox label{}。prettyCheckable插件使用如下代码
输入.prop'checked',true.change;
将状态更改转发到复选框。另一方面,jqGrid包含click事件句柄,请参见
您可以做的是在发生更改事件时触发单击事件
例如,让我们使用id=list的网格。然后,用于选择所有项目的复选框的id将被cb_list cb_与网格id一起追加
$cb_list.prettycheckeble;
我建议您将代码更改为以下内容
$cb_list.changefunction{
$this.triggerHandlerclick;
}.可检查的;
它会解决你的问题。@Fuiba:不客气!对不起,我不明白您在第一次输入下的意思,以及您所指的复选框样式。你能更清楚地描述一下你的问题吗?您没有包含用于prettyCheckable的代码。你换哪种支票箱?您的屏幕短片仅包含multiselect列标题中的复选框。您对复选框或其他复选框有问题吗?@Fuiba:您的意思是您需要对multiselect列的每个复选框使用prettyCheckable?我不知道您使用哪种代码来执行此操作,但我担心您会遇到其他问题。如果您使用loadComplete:function{$this.findinput.cbox.prettyCheckable;},那么您将拥有所有的复选框,但您必须编写额外的代码才能使所有的复选框都在jqGrid中工作。@Fuiba:我之前写过,对所有复选框使用prettyCheckable需要编写许多额外的代码。您必须实现onSelectAll和onsecrow,这两个选项可以选择复选框。prettyCheckable.js bind点击一个标签,但是如果jqGrid设置了复选框的状态,该复选框通过不控制stat hidden复选框的更改而隐藏。我写信给你说,你可能需要编写许多代码才能在jqGrid中完全实现prettyCheckable。@Fuiba:例如OnSeRow:函数rowid{$jqg+$.jgrid.jqIDthis.id+.+rowid.nexta.toggleClass'checked';}可能是必需的,也可能是更复杂的代码。同样,您也需要实现onSelectAll,它可以从prettyCheckable的部分中添加或删除选中的类。@Fuiba:我很奇怪为什么您对ID使用如此奇怪的值。您可以使用$'edit'和document.getElementById'edited'。这意味着您真的进行了id=编辑?是这样吗?我认为这些名称在HTML中的id是不正确的。你为什么用这么疯狂的ID?顺便说一下,如果id=edited,表达式$'edit'将是错误的。
$("input[type=checkbox]").change(function() {
$(this).triggerHandler("click");
}).prettyCheckable();
$(document).ready(function() {
$('#searchForm').ajaxForm(function() {
var _data = $('#searchForm').serialize();
$('#ResultsTable').jqGrid().setGridParam({url: '${searchUrl}' + _data}).trigger("reloadGrid")
return true;
});
jsonTable('ResultsTable', 'ResultsPager', '${searchUrl}', 'searchForm',
{id: 'code'},
['Code', 'Description', 'CF'],
[{name: 'code', index: 'code', width: 55},
{name: 'description', index: 'description', width: 90},
{name: 'CF', index: 'CF', width: 80},
function(id) {
var selRows = $(this).jqGrid('getGridParam', 'selarrrow');
$('#edit').toggle(selRows.length == 1);
$('#delete').toggle(selRows.length > 0);
$('#editForm #code').val(selRows);
$('#deleteForm #code').val(selRows);
},
function(aSel, selected) {
$('#edit').toggle(false);
$('#delete').toggle(selected);
if (selected) {
$('#editForm #code').val(selRows);
$('#deleteForm #code').val(selRows);
}
},
true
)
});