0

我有一个关于 jqgrid 的问题。为了在我的网格中编辑一行,您必须选择使用操作格式化程序的编辑按钮。这使得几乎整行都可以编辑。

我的问题是,如果用户单击另一个行编辑按钮,而不是当前可编辑行上的取消或提交按钮,有没有办法将第一个可编辑行返回到不可编辑状态,同时保持新选择的行可编辑?

如果您想检查,这里是网格。相当大量的代码。数据通过函数传递到网格。这是大型 MVC 应用程序的一部分。数据为json格式。

将不胜感激有关前进方向的建议。

 grid.jqGrid({
        datatype: "local",
        data: gridData,
        colNames: ['Action', 'ID', 'Center', 'DBA', 'Check Number', 'Received Date', 'Check Amount', 'Unposted Amount', 'Posted Amount', 'Comments', 'Check Date', 'Received By', 'Withdrawn By', 'Withdrawal Date', 'Witness', 'Is Posted?', 'Is NSed?', 'Refunded Amount', 'Batch Number'],
        colModel: [
            { name: 'act', index: 'act', width: 55, align: 'center', sortable: false, formatter: 'actions',
                formatoptions: { keys: true,
                    delbutton: false,
                    extraparam: { CheckLogId: getChecklogId, IsPosted: getIsPosted, CheckAmountPosted: getCheckAmountPosted, BatchNumberSequence: getBatchSeqNumber, IsNSed: getIsNSed },
                    afterSave: afterEditSave,
                    onSuccess: afterOnSuccess,
                    afterRestore: function (rowid) {
                        var acc_list = getAccountDBAOnCenter(last_center);
                        grid.setColProp('AccountId', { editoptions: { value: convertToSelectList(acc_list)} });
                        grid.trigger('reloadGrid');

                        if (!isCurrentUserAdmin) {
                            grid.setCell(rowid, 2, '', { 'visibility': 'visible' });
                        }
                    },                      
                    onEdit: function (rowid) {
                        edit_row_id = rowid;
                        grid.trigger('reloadGrid');
                        if (grid.getCell(rowid, 'IsPosted') == true) {
                            var checkAmountInput = '#' + rowid + '_CheckAmount';
                            $(checkAmountInput).prop("disabled", true);
                        }
                        else {
                            var checkAmountInput = '#' + rowid + '_CheckAmount';
                            $(checkAmountInput).prop("disabled", false);
                        }
                        if (!isCurrentUserAdmin) {
                            grid.setCell(rowid, 'CenterId', '', { 'visibility': 'hidden' });                                
                        }                           
                        checklog_id = grid.getCell(rowid, 'CheckLogId');
                        batch_sql_num = grid.getCell(rowid, 'BatchNumberSequence');
                        is_posted = grid.getCell(rowid, 'IsPosted');
                        check_amount_posted = grid.getCell(rowid, 'CheckAmountPosted');
                        check_amount_refunded = grid.getCell(rowid, 'CheckAmountRefunded');
                        is_nsed = grid.getCell(rowid, 'IsNSed');
                        batch_sql_num = batch_sql_num == '' ? '-' : batch_sql_num;
                    }
                }
            },
            { name: "CheckLogId", index: "CheckLogId", width: 40, align: "center", editable: false, hidden: true, editrules: { required: true, edithidden: true }, search: false },
            { name: "CenterId", index: "CenterId", width: 200, align: "left", editrules: { required: true },
                editable: true,
                formatter: 'select',
                edittype: 'select',
                editoptions: {
                    value: getSelectList(center_list),
                    style: 'width:190px',
                    dataInit: function (elem) {
                        var center_id = $(elem).val();
                        if (center_id == '') {
                            center_id = $("#center_id").val();
                        }
                        last_center = center_id;
                        var list_data = getAccountDBAOnCenter(center_id);
                        grid.setColProp('AccountId', { editoptions: { value: convertToSelectList(list_data)} });
                    },
                    dataEvents: [
                            {
                                type: 'change',
                                fn: function (e) {
                                    resetAccountDBAValues();
                                    var center_id = parseInt($(e.target).val(), 10);
                                    var dba_select_list = getAccountDBAOnCenter(center_id);

                                    var newOptions = '';
                                    $.each(dba_select_list, function (i, dbaRecord) {
                                        newOptions += '<option role="option" value="' +
                                                    dbaRecord.AccountId + '">' +
                                                    dbaRecord.DBAName + '</option>';
                                    });
                                    if ($(e.target).is('.FormElement')) {
                                        var form = $(e.target).closest('form.FormGrid');
                                        var acccountElm = form.find("select#AccountId.FormElement");
                                        acccountElm.removeAttr("disabled");
                                        acccountElm.html(newOptions);
                                    } else {
                                        var row = $(e.target).closest('tr.jqgrow');
                                        var rowId = row.attr('id');
                                        $("select#" + rowId + "_AccountId", row[0]).html(newOptions);
                                    }
                                }
                            }
                        ]
                }, search: false
            },
            { name: "AccountId", index: "AccountId", width: 200, align: "left", formatter: 'select', editable: true, editrules: { required: true },
                edittype: 'select',
                editoptions: { value: dba_select_list_json, style: 'width:190px' },
                search: true
            },
            { name: "CheckNumber", index: "CheckNumber", width: 110, align: "left", editable: true, editrules: { required: true }, edittype: 'text', editoptions: { size: 10, maxlength: 10, style: 'width:90px' }, search: false },
            { name: "ReceivedDate", index: "ReceivedDate", width: 100, align: "center", datefmt: 'm/d/yy', formatter: jsonDateFormatter, editable: true, editrules: { date: false, required: true, custom: true, custom_func: dateValidate }, edittype: 'text', editoptions: { size: 10, maxlength: 10, style: 'width:90px', dataInit: function (element) { $(element).datepicker({ dateFormat: 'm/d/yy', changeYear: true, changeMonth: true }) } }, search: false },
            { name: "CheckAmount", index: "CheckAmount", width: 110, align: "left", formatter: 'currency', editable: true, editrules: { required: true, number: true }, edittype: 'text', editoptions: { size: 10, maxlength: 10, style: 'width:90px' }, formatoptions: { decimalSeparator: ".", thousandsSeparator: ",", decimalPlaces: 2, prefix: "$" }, search: false },
            { name: "CheckAmountUnposted", index: "CheckAmountUnposted", width: 120, align: "center", formatter: uPostFormatter, editable: false, editrules: { required: true, edithidden: true }, formatoptions: { decimalSeparator: ".", thousandsSeparator: ",", decimalPlaces: 2, prefix: "$" }, search: false },
            { name: "CheckAmountPosted", index: "CheckAmountPosted", width: 120, align: "center", formatter: 'currency', editable: false, editrules: { required: true, edithidden: true }, formatoptions: { decimalSeparator: ".", thousandsSeparator: ",", decimalPlaces: 2, prefix: "$" }, search: false },
            { name: "CheckDescription", index: "CheckDescription", width: 180, align: "left", editable: true, editrules: { required: false }, edittype: 'text', editoptions: { size: 100, maxlength: 100, style: 'width:200px' }, search: false },
            { name: "CheckDate", index: "CheckDate", width: 100, align: "center", formatter: jsonDateFormatter, editable: true, editrules: { required: true, custom: true, custom_func: checkValidation }, edittype: 'text', editoptions: { size: 10, maxlength: 10, style: 'width:90px', dataInit: function (element) { $(element).datepicker({ dateFormat: 'm/d/yy', changeYear: true, changeMonth: true }) } } },
            { name: "ReceivedBy", index: "ReceivedBy", width: 120, align: "left", editable: true, editrules: { required: true }, edittype: 'text', editoptions: { size: 15, maxlength: 15, style: 'width:110px' }, search: false },
            { name: "WithdrawnBy", index: "WithdrawnBy", width: 120, align: "left", editable: true, editrules: { required: false }, edittype: 'text', editoptions: { size: 15, maxlength: 15, style: 'width:110px' }, search: false },
            { name: "WithdrawnDate", index: "WithdrawnDate", width: 100, align: "center", datefmt: 'm/d/yy', formatter: jsonDateFormatter, editable: true, editrules: { date: false, required: false, custom: true, custom_func: dateValidate }, edittype: 'text', editoptions: { size: 10, maxlength: 10, style: 'width:90px', dataInit: function (element) { $(element).datepicker({ dateFormat: 'm/d/yy', changeYear: true, changeMonth: true }) } }, search: false },
            { name: "WitnessedBy", index: "WitnessedBy", width: 120, align: "left", editable: true, editrules: { required: false }, edittype: 'text', editoptions: { size: 15, maxlength: 15, style: 'width:110px' }, search: false },
            { name: "IsPosted", index: "IsPosted", width: 75, align: "center", editable: false, formatter: booleanFormatter, unformat: booleanUnFormatter, editrules: { required: true, edithidden: true }, search: false },
            { name: "IsNSed", index: "IsNSed", width: 75, align: "center", editable: false, formatter: booleanFormatter, unformat: booleanUnFormatter, editrules: { required: true, edithidden: true }, search: false },
            { name: "CheckAmountRefunded", index: "CheckAmountRefunded", width: 120, align: "center", formatter: 'currency', editable: false, editrules: { required: true, edithidden: true }, formatoptions: { decimalSeparator: ".", thousandsSeparator: ",", decimalPlaces: 2, prefix: "$" }, search: false },
            { name: "BatchNumberSequence", index: "BatchNumberSequence", width: 120, align: "left", editable: false, edittype: 'text', search: false }
        ],
        pager: '#checklog-table-pager',
        rowNum: 25,
        rowList: [25, 50, 75, 100, 1000000],
        gridview: true,
        rownumbers: false,
        ignoreCase: true,
        viewrecords: true,
        width: 1040,
        height: 400,
        autowidth: false,
        shrinkToFit: false,
        scrolling: true,
        loadonce: false,
        editurl: '/Payment/SaveChecklog',
        loadComplete: loadGridComplete,
        ondblClickRow: function (rowid, iRow, iCol, e) {
            if (grid.getCell(rowid, 'IsNSed') == false) {
                if (showPaymentCallBack) {
                    showPaymentCallBack(rowid);
                }
            }
        }
    }).jqGrid('navGrid', '#checklog-table-pager',
        { add: true, edit: false, del: false },
        {},
        {
            caption: 'Add',
            recreateForm: true,
            mtype: "post",
            width: 520,
            addCaption: "Add Check",
            reloadAfterSubmit: true,
            closeAfterAdd: true,
            bSubmit: "Save",
            onclickSubmit: beforeAdd,
            afterSubmit: addComplete,
            beforeShowForm: beforeShowAdd
        },
        {},
        { multipleSearch: true, overlay: false }
    ).navButtonAdd("#checklog-table-pager", {
        caption: 'Export',
        title: 'Export to Excel',
        buttonicon: 'ui-icon-extlink',
        onClickButton: function () {
            var fileName = 'checklog_for_center_' + center_id + '.xls';
            var dataUrl = 'PaymentService/GetCheckLog';
            var searchParameters = getCheckLogIds();

            $("#checklog-table").jqGrid('excelExport', { url: '/Spreadsheet/Index?fileName=' + fileName + '&dataUrl=' + dataUrl + '&filter=' + searchParameters });
        }
    });


    $("#checklog-table-pager table.navtable tbody tr").append(
            '<td><div><input type="checkbox" class="searchClosedBox" id="navSearchClosedBox"/>NLO Deal</div></td>');
    $(".searchClosedBox").change(function () {
        if ($(this).is(':checked')) {
            search_closed = true;
            var acc_list = getAccountDBAOnCenter($("#center_id").val());
            dba_select_list_json = acc_list;
            dba_list = acc_list;
            grid.setColProp('AccountId', { editoptions: { value: convertToSelectList(acc_list)} });
            grid.trigger('reloadGrid');
        }
        else {
            search_closed = false;
            var acc_list = getAccountDBAOnCenter($("#center_id").val());
            dba_select_list_json = acc_list;
            dba_list = acc_list;
            grid.setColProp('AccountId', { editoptions: { value: convertToSelectList(acc_list)} });
            grid.trigger('reloadGrid');
        }
    })
4

1 回答 1

1

//设置当前行为false

grid.editRow(current_row_id, false);

// 将新行设置为可编辑

grid.editRow(new_row_id, true);

.. 或者每次选择一行时,您都可以添加一个标志。然后在单击时禁用带有该标志的所有行。

$cur_row.on("click", function(){
// Select all rows's with that flag, disable them and remove flag.
// Add Flag Class to this 
// Then enable this one only.
}
于 2013-07-29T20:00:20.690 回答