jqGrid的自定义edittype(单选按钮列)自定义元素不是射击编辑组事件(jqGrid cus

2019-08-18 04:12发布

我有需要在编辑时行的一列单选按钮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', sortable: false, editable: true, edittype: 'checkbox', editoptions: { value: "True:False" }, formatter: "checkbox", width: 140 },
        { name: 'Comments', index: 'Comments', align: 'center', sortable: false, editable: true, edittype: "textarea", editoptions: { rows: "3", cols: "16" }, width: 180 },
        { name: 'SubDocument', index: 'SubDocument', editable: false, width: 1 },
        { name: 'NA', index: 'NA', editable: true, 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, previouslyselectedRow, 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, options, elem) {
        debugger;
        var text = $(elem).text();
        return text === '&nbsp;' ? '' : text;
    }
});

问题我有是,当我选择一个行和检查的编辑按钮不火radiovalue功能设置。 它激发得到radiovalue功能,而当选择了行创建单选按钮。 任何帮助,这样我可以设置一个值的单选按钮?

谢谢

Answer 1:

我认为你是对的。 有在使用差异custom_value在不同的编辑模式回调。

如果使用表单编辑和一些编辑列有edittype: 'custom' ,然后第一custom_element功能(在你的情况下,它radioelem功能)的内部调用$.jgrid.createEl 。 然后custom_value将在以下情况下还叫rowid !== "_empty" (不添加表格)。 见行代码的细节。

问题是, custom_element具有value的参数。 因此,它可以设置自定义的控制值,并调用custom_element和其他通话custom_value"set"是不是真的需要。

另一个编辑模式(在线编辑和单元格编辑)刚刚创建自定义的控制。 回调custom_value将永远不会调用"set"参数。

我确认文件有关自定义控制太短。 我想,你可以删除你的代码的一部分radiovalue的一部分'set' 。 我认为下面的代码将良好的工作太(即使在表单编辑的情况下):

function radiovalue(elem, operation, value) {
    if (operation === 'get') {
        return $(elem).val();
    }
}

一注:如果你会尝试的自定义控件的用途,应该不要忘记使用recreateForm:真正的选项。 正如行内编辑使用自定义控件的一个例子,形成编辑和搜索,你会发现在这里 。 在演示的参考,你会发现答案 。



文章来源: jqGrid custom edittype (radio button column) custom element not firing set event on edit