在 jqgrid 内联编辑中将数据传递给控制器

Question

我需要将数据从内联网格传递到控制器

我在 jqgrid 中有两列并使用了 editurl 属性

但不知道具体怎么用

这是我的 JqGrid 代码

jQuery(document).ready(function () {
        var pageWidth = $(window).width();
        var lastSel;
        $("#sortrows").setGridWidth(pageWidth);
        $('#sortrows').jqGrid('GridUnload');
        jQuery("#sortrows").jqGrid({            
            datatype: "local",
            mtype: "GET",
            hoverrows: false,
            jsonReader: { repeatitems: false, id: "Code" },
            ajaxGridOptions: { timeout: 30000 },
            colNames: PricelistHeaderColName,
            colModel: PricelistHeaderModel,
            id: 'Code',
            localReader: { id: 'Code' },
            prmNames: { id: "Code" },
            rowNum: 10,            
            rowList: [10, 20, 30],
            hidegrid: false,
            rownumbers: true,
            viewrecords: true,
            height: 'auto',
            width: pageWidth,
            scrollOffset: 0,
            gridview: true,
            autowidth:true,
            shrinkToFit: true,
            pager: '#psortrows',
            sortname: 'Description',
            autoencode: true,
            loadonce: true,
            ignoreCase: true,
            multiselect: false,
            viewrecords: true,
            sortorder: "asc",
            caption: "PriceList Headers",
            editurl: "../Header/Save",                   
        });

        $('#sortrows').jqGrid('setLabel', 'Description', "Description", { 'text-align': 'left' });

        jQuery("#sortrows").jqGrid('navGrid', '#psortrows',
            {
                edit: false,
                add: false,
                del: false,

            });



        jQuery("#sortrows").jqGrid('inlineNav', '#psortrows',
            {
                add: true,
                addtext: "Add",
                addicon:"ui-icon-plus",
                edit: true,
                editicon: "ui-icon-pencil",
                edittext: "Edit",
                save: true,
                saveicon: "ui-icon-disk",
                savetext:"Save",
                cancel: true,
                cancelicon: "ui-icon-cancel",
                canceltext: "Cancel",
                search: true,
                searchtext: "Seaech",                
            });
 jQuery("#sortrows").jqGrid('sortableRows', { items: '.jqgrow:not(.unsortable)' });

        $('#sortrows').jqGrid('filterToolbar', { searchOnEnter: false, enableClear: false, defaultSearch: "cn", stringResult: true });

        //var myData = $('#sortrows').jqGrid('getDataIDs');        
        for (var i = 0; i < myData.length; i++) {            
            //jQuery("#sortrows").addRowData(myData[i].Code, myData[i]);
            $("#sortrows").jqGrid('addRowData', i + 1, myData[i]);

        }

    });

这是我的 HTMl 页：

<div>
        <label class="col span_1_of_2lbl">
            <span style="font-family:'Segoe UI';font-size:13px;font-weight:bold;color:white ;">Environment</span>
        </label>
        <div class="drg_drop_one">
            <div style="padding-top: 13px;">
                @Html.DropDownListFor(model => model.Environment, environmentList, new SelectListItem { Value = Model.EnvironmentCode })
            </div>
        </div>
    </div>

<div style="margin-top:40px;">
        <table id="sortrows" RequestURL="@Url.Action("LoadPriceListHeadersGrid", "Header")"></table>
        <div id="psortrows"></div>
    </div>

我们是否有任何方法来获取已编辑的行属性并将下拉 UI 值附加到该编辑行对象？

或者我们可以在editrow事件中定义任何ajax方法？

请帮我解决这个问题

Answer 1

内联编辑使用的基本方法是editRow、saveRow和restoreRow。 addRow 方法在内部使用 editRow。要发送附加数据，应指定 saveRow 或 editRow 的 extraparam 选项。问题是方法 addRow、editRow 和 saveRow 将在使用 inlineNav 的情况下被间接调用。因此，您必须指定相应的附加参数。

如需使用 free jqGrid you can just add the option to jqGrid and all inline editing methods will use the options automatically. See the wiki 文章了解详情。额外的 jqGrid 选项将显示为

inlineEdit: {
    extraparam: {
        environment: function () {
            return $(".drg_drop_one select").val();
        }
    }
}

如果使用更旧版本的 jqGrid，代码应该如下所示

var inlineEditOptions = {
        extraparam: {
            environment: function () {
                return $(".drg_drop_one select").val();
            }
        }
    };

jQuery("#sortrows").jqGrid('inlineNav', '#psortrows', {
    add: true,
    addtext: "Add",
    addicon:"ui-icon-plus",
    edit: true,
    editicon: "ui-icon-pencil",
    edittext: "Edit",
    save: true,
    saveicon: "ui-icon-disk",
    savetext:"Save",
    cancel: true,
    cancelicon: "ui-icon-cancel",
    canceltext: "Cancel",
    search: true,
    searchtext: "Seaech",                
    // additional parameters below:
    editParams: inlineEditOptions,
    addRowParams: {addParams: inlineEditOptions }
});

在 jqgrid 内联编辑中将数据传递给控制器

pass data to the controller in jqgrid inline editing

model-view-controller

jquery

jqgrid