我有一个jqGrid,在编辑时需要在一行中有单选按钮.
以下是我的代码：
以下是我的代码：
function BindPreclosingDocs(response) {
var prevIoUslyselectedRow;
var preclosingtable = $('#preclosing');
preclosingtable.jqGrid({
datatype: 'jsonstring',datastr: JSON.stringify(response.ServiceModel),colNames: ['','Documents Received','Comments','SubDocument','NA'],colModel: [
{ name: 'Documents',index: 'Documents',align: 'left',sortable: false,editable: false,width: 240 },{ name: 'DocsReceived',index: 'DocsReceived',align: 'center',editable: true,edittype: 'checkBox',editoptions: { value: "True:False" },formatter: "checkBox",width: 140 },{ name: 'Comments',index: 'Comments',edittype: "textarea",editoptions: { rows: "3",cols: "16" },width: 180 },{ name: 'SubDocument',index: 'SubDocument',width: 1 },{ name: 'NA',index: 'NA',formatter: 'dynamicText',width: 150,edittype: 'custom',editoptions: { custom_element: radioelem,custom_value: radiovalue} }
],rowNum: response.ServiceModel.PreClosing.length,pager: '#preclosingpagerdiv',viewrecords: true,sortorder: "asc",sortname: 'Documents',jsonReader: {
root: "PreClosing",repeatitems: false,id: 'ConfigId'
},shrinkToFit: false,height: 'auto',grouping: true,groupingView: {
groupField: ['SubDocument'],groupColumnShow: [false],plusicon: 'ui-icon-circle-triangle-s',minusicon: 'ui-icon-circle-triangle-n'
},loadComplete: function () {
HideGroupHeaders(this);
},onSelectRow: function (id) {
preclosingtable.jqGrid('saveRow',prevIoUslyselectedRow,false,'clientArray');
prevIoUslyselectedRow = SetJQGridRowEdit(id,preclosingtable);
}
});
preclosingtable.setGridWidth('710');
};
//RowSelect
function SetJQGridRowEdit(id,prevIoUsid,grid) {
if (id && id !== prevIoUsid) {
grid.jqGrid('restoreRow',prevIoUsid);
grid.jqGrid('editRow',id,true);
prevIoUsid = id;
return prevIoUsid;
}
};
//Build radio button
function radioelem(value,options) {
var receivedradio = '<input type="radio" name="receivednaradio" value="R"';
var breakline = '/>Received<br>';
var naradio = '<input type="radio" name="receivednaradio" value="N"';
var endnaradio = '/>NA<br>';
if (value == 'Received') {
var radiohtml = receivedradio + ' checked="checked"' + breakline + naradio + endnaradio;
return radiohtml;
}
else if (value == 'NA') {
var radiohtml = receivedradio + breakline + naradio + ' checked="checked"' + endnaradio;
return radiohtml;
}
else {
return receivedradio + breakline + naradio + endnaradio;
}
};
function radiovalue(elem,operation,value) {
if (operation === 'get') {
return $(elem).val();
} else if (operation === 'set') {
if ($(elem).is(':checked') === false) {
$(elem).filter('[value=' + value + ']').attr('checked',true);
}
}
};
我的格式化程序和unformatter代码如下
dynamicText: function (cellvalue,options,rowObject) {
if (cellvalue == 'R') {
return 'Received';
}
else if (cellvalue == 'N') {
return 'NA';
}
else {
return '';
}
}
$.extend($.fn.fmatter.dynamicText,{
unformat: function (cellValue,elem) {
debugger;
var text = $(elem).text();
return text === ' ' ? '' : text;
}
});
我遇到的问题是,当我选择一行并检查编辑按钮时,它不会在radiovalue函数中触发设置.当选择行时,它会在创建单选按钮时触发无线电值功能.任何帮助,以便我可以设置单选按钮的值？！
谢谢
解决方法
我认为你是对的.不同编辑模式下custom_value回调的使用有所不同.
如果使用表单编辑并且某些可编辑列具有edittype：’custom’,那么将在$.jgrid.createEl内部调用第一个custom_element函数(在您的情况下是它的radioelem函数).然后在rowid！==“_empty”的情况下另外调用custom_value(不适用于Add form).有关详情,请参见the lines of code.
问题是custom_element有value参数.因此,它可以在自定义控件中设置值并调用custom_element,并且实际上不需要使用“set”调用custom_value.
另一种编辑模式(内联编辑和单元格编辑)只是创建自定义控件.永远不会使用“set”参数调用回调custom_value.
我确认the documentation关于自定义控件太短了.我想你可以删除部分’set’的代码radiovalue部分.我认为以下代码也能很好地工作(即使在表单编辑的情况下)：
function radiovalue(elem,value) { if (operation === 'get') { return $(elem).val(); } }
一句话：如果您尝试使用自定义控件,则不要忘记使用recreateForm: true选项.作为内联编辑,表单编辑和搜索中的使用自定义控件的示例,您将找到here.您将在the answer中找到该演示的参考.
