2

我有一个 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);
        }
    }
};

我的格式化程序和取消格式化程序代码如下

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功能中发射。有什么帮助可以让我为单选按钮设置一个值吗？！

谢谢

4

1 回答 1

3

我认为你是对的。custom_value在不同的编辑模式下，回调的使用是有区别的。

如果使用表单编辑并且某些可编辑列具有edittype: 'custom'然后第一个custom_element函数（在您的情况下是radioelem函数）将在$.jgrid.createEl. 然后custom_value将在以下情况下额外调用rowid !== "_empty"（不适用于添加表单）。有关详细信息，请参阅代码行。

问题是custom_element有value参数。因此它可以在自定义控件中设置值并调用，并且不需要custom_element额外调用custom_valuewith 。"set"

另一种编辑模式（内联编辑和单元格编辑）只是创建自定义控件。custom_value永远不会使用"set"参数调用回调。

我确认有关自定义控件的文档太短。我想您可以删除 part 的部分radiovalue代码'set'。我认为以下代码也可以很好地工作（即使在表单编辑的情况下）：

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

一句话：如果您尝试使用自定义控件，您应该不要忘记使用recreateForm: true选项。作为在内联编辑、表单编辑和搜索中使用自定义控件的示例，您将在此处找到。您将在答案中找到对演示的参考。

于 2013-03-29T00:29:08.717 回答