Раскрывающийся список jqgrid не загружается после публикации на сервере или обновления страницы - PullRequest
0 голосов
/ 04 июля 2018

Я новичок в использовании JQGrid и после большого количества исследований я отправляю этот вопрос.

Я заполняю раскрывающийся список в jqgrid через dataurl и собираю html с функцией buildselect.

В первый раз, когда я пытаюсь добавить новую строку, она работает отлично, создается раскрывающийся список и заполняются параметры.

Однако после заполнения строки сетки и нажатия кнопки «Сохранить» я отправляю данные в метод действия MVC (PostTestData) и сохраняю опубликованные значения в переменной сеанса. Когда я проверяю опубликованные данные, я вижу, что выбранное значение является строковым типом данных.

Из PostTestData я перенаправляю на другой метод действия GetTestData, который будет загружать сохраненные данные обратно в сетку, это правильно загружает все текстовые значения, но раскрывающийся список отображается как пустая ячейка и предварительно не выбирает выбранное значение.

Встроенная функция выбора в этот момент не вызывается, а вызывается только после того, как я щелкну пустую ячейку и будет создан новый раскрывающийся список. Я изо всех сил пытаюсь вернуть выпадающий список после перезагрузки почты и сетки.

Я вставляю свой фактический код ниже

$(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;
    }

enter image description here

Любая помощь будет оценена, поскольку я буквально застрял. Спасибо

1 Ответ

0 голосов
/ 08 июля 2018

Я исправил это, удалив форматтер: 'select' в colModel для этого конкретного столбца, и при обновлении сетки он показал правильное значение.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...