Question

我是使用JQGrid的新手，经过大量研究，我发布了这个问题。

我正在通过dataurl将下拉列表填充到jqgrid中，并使用buildselect函数构建了html。

当我第一次尝试添加新行时，它工作得很好，并且创建了下拉列表并填充了选项。

但是，在填充网格行并单击保存之后，我将数据发布到MVC操作方法（PostTestData），并将发布的值保存在会话变量中。检查发布的数据时，我可以看到所选值是字符串数据类型。

我从PostTestData重定向到另一个操作方法GetTestData，它将保存的数据重新加载到网格中，这正确地加载了所有文本值，但是下拉列表显示为空单元格，并且未预先选择选择的值。

此时不会调用内置的select函数，只有在我单击空单元格并创建一个新的下拉列表之后，才会调用内置的select函数。我正在努力在邮局和网格重新加载后如何找回下拉菜单。

我在下面粘贴我的实际代码

$(function () {

var myGrid = $('#workOrderDetailGrid');
myGrid.jqGrid({
    url: '/CustomerWorkOrders/WorkOrder/GetTestData',
    datatype: "json",
    contentType: "application/json; charset-utf-8",
    mtype: 'GET',
    colNames: ['Brand', 'Product Type', 'Received Model', 'Shipped Model', 'Serial number', 'Product Version', 'Quantity', 'Customer Complaint'],
    jsonReader: { repeatitems: false, id: "Product Type" },
    colModel: [
        {
            name: 'BrandList', width: 200, editable: true, edittype: "select", formatter: 'select',
            editoptions:
                {
                    dataUrl: "/CustomerWorkOrders/WorkOrder/GetBrandDropdown",
                    datatype: "json",
                    async: false,
                    buildSelect: function (data) {
                        var response = jQuery.parseJSON(data);

                        var s = '<select>';
                        s += '<option value="0">---Select Brand---</option>';

                        $.each(response, function () {
                            s += '<option value="' + this.Id + '">' + this.Value + '</option>';
                        });

                        return s + "</select>";
                    }
                }
        },
        { name: 'ProductType', key: true, width: 200, editable: true },
        { name: 'ReceivedModel', key: true, width: 75, editable: true },
        { name: 'ShippedModel', key: true, width: 200, editable: true },
        { name: 'Serialnumber', key: true, width: 100, editable: true },
        { name: 'ProductVersion', width: 200, editable: true },
        { name: 'Quantity', key: true, width: 100, editable: true },
        { name: 'CustomerComplaint', key: true, width: 100, editable: true }
    ],
    rowNum: 5,
    loadonce: true,
    pager: '#workOrderDetailPager',
    cellEdit: true,
    gridview: true,
    rownumbers: true,
    viewrecords: true,
    pagerpos: 'center',
    caption: "Workorder subtypes",
    editable: true,
    ajaxRowOptions: { contentType: 'application/json; charset=utf-8' },
    ajaxSelectOptions: { cache: false },
    serializeRowData: function (postData) {
        return JSON.stringify(postData);
    },
    editurl: '/CustomerWorkOrders/WorkOrder/PostTestData'
});

myGrid.jqGrid('navGrid', '#workOrderDetailPager',
    {
        edit: false,
        add: false,
        del: false,
        search: false
    });


myGrid.jqGrid('inlineNav', '#workOrderDetailPager',
    {
        edit: true,
        editicon: "ui-icon-pencil",
        add: true,
        addicon: "ui-icon-plus",
        save: true,
        saveicon: "ui-icon-disk",
        cancel: true,
        cancelicon: "ui-icon-cancel",

        editParams: {
            keys: false,
            oneditfunc: null,
            successfunc: function (val) {
                if (val.responseText != "") {
                    alert(val.responseText);
                    $(this).jqGrid('setGridParam', { datatype: 'json' }).trigger('reloadGrid');
                }
            },
            url: '/CustomerWorkOrders/WorkOrder/PostTestData',
            aftersavefunc: null,
            errorfunc: null,
            afterrestorefunc: null,
            restoreAfterError: true,
            mtype: "POST"
        },
        addParams: {
            useDefValues: true,
            addRowParams: {
                keys: true,
                extraparam: {},
                beforeSaveRow: function () { alert(); },
                saveRow: function (response, postdata) {
                    alert();
                },
                successfunc: function (val) {
                    if (val.responseText != "") {
                        alert(val.responseText);
                        $(this).jqGrid('setGridParam', { datatype: 'json' }).trigger('reloadGrid');
                    }
                }
            }
        }
    }
);

}）;

现在是posttestdata和gettestdata的控制器操作方法

    [HttpPost]
    public ActionResult PostTestData(WorkOrderSubDetailsVm workOrderSub)
    {
        if (Session["WorkOrderSubTypeList"] == null)
        {
            Session["WorkOrderSubTypeList"] = new List<WorkOrderSubDetailsVm>();
        }

        var list = (List<WorkOrderSubDetailsVm>)Session["WorkOrderSubTypeList"];
        list.Add(workOrderSub);

        return RedirectToAction("GetTestData", new { sidx = "", sord = "asc", page = 1, rows = 5 });
    }


      [OutputCache(Duration = 300)]
    public ActionResult GetTestData(string sidx, string sord, int page, int rows)
    {
        List<WorkOrderSubDetailsVm> workOrderSubDetailsList = null;
        if (Session["WorkOrderSubTypeList"] != null)
        {
            workOrderSubDetailsList = (List<WorkOrderSubDetailsVm>)Session["WorkOrderSubTypeList"];
        }

        int pageSize = rows;
        int totalRecords = workOrderSubDetailsList?.Count ?? 4;
        int totalPages = (int)Math.Ceiling((float)totalRecords / (float)pageSize);

        var jsonData = new
        {
            total = totalPages,
            page = page,
            records = totalRecords,
            rows = workOrderSubDetailsList
        };

        return Json(jsonData, JsonRequestBehavior.AllowGet);
    }

最后是通过dataurl填充下拉列表的代码

        public ActionResult GetBrandDropdown()
    {
        var newList = GetBrands();

        return Json(newList, JsonRequestBehavior.AllowGet);
    }

    private List<Brand> GetBrands()
    {
        var newList = new List<Brand>()
        {
            new Brand() {Id = "LG", Value = "LG"},
            new Brand() {Id = "Segway", Value = "Segway"},
            new Brand() {Id = "Lotus", Value = "Lotus"}
        };
        return newList;
    }

任何帮助都将不胜感激，因为我确实会坚持下去。谢谢

Answer 1

我通过删除格式化程序来解决此问题：在colModel中为该特定列选择“选择”，并在网格刷新时显示正确的值。

发布到服务器或页面刷新后未加载jqgrid下拉列表

1 个答案: