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

时间:2015-05-21 12:09:00

标签: jquery model-view-controller jqgrid

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

我在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方法吗?

请帮我解决这个问题

1 个答案:

答案 0 :(得分:0)

内联编辑中使用的基本方法是editRowsaveRowrestoreRow。方法addRow在内部使用editRow。要发送其他数据,应指定extraparamsaveRow的{​​{1}}选项。问题是,在使用editRow的情况下,将间接调用方法addRoweditRowsaveRow。因此,您必须指定相应的附加参数。

如果使用free jqGrid,您只需将选项添加到jqGrid,所有内联编辑方法都会自动使用这些选项。有关详细信息,请参阅the wiki文章。其他jqGrid选项将显示为

inlineNav

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

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