jQuery   发布时间:2022-04-19  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了jquery – jqGrid自定义edittype(单选按钮列)自定义元素未在编辑时触发set事件大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个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);
        }
    }
};@H_616_4@ 
 

我的格式化程序和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 === '&nbsp;' ? '' : text;
    }
});@H_616_4@ 
 

我遇到的问题是,当我选择一行并检查编辑按钮时,它不会在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();
    }
}@H_616_4@ 
 

一句话:如果您尝试使用自定义控件,则不要忘记使用recreateForm: true选项.作为内联编辑,表单编辑和搜索中的使用自定义控件的示例,您将找到here.您将在the answer中找到该演示的参.

大佬总结

以上是大佬教程为你收集整理的jquery – jqGrid自定义edittype(单选按钮列)自定义元素未在编辑时触发set事件全部内容,希望文章能够帮你解决jquery – jqGrid自定义edittype(单选按钮列)自定义元素未在编辑时触发set事件所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。