Как создать несколько экземпляров jqgrid с помощью jquery? - PullRequest
Новая
       36

Как создать несколько экземпляров jqgrid с помощью jquery?

0 голосов
/ 10 ноября 2018

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

Мне нужно динамически создать множество экземпляров jqgrid из jquery и добавить их в список в формате html.

Моя проблема в том, что в разделе разбивки на страницы navGrid не отображаются кнопки добавления / редактирования по умолчанию, а также пользовательские кнопки, добавляемые вручную.

Вот пример кода: 

function NewgJQGridInstance(houseHoldGridId, gridPlaceholder) {
                //Local variables
                var myGrid = $("<table>").attr("id", houseHoldGridId);
                var myPager = $("<div>").attr("id", houseHoldGridId + "_pager");

                function publicInit() {
                    gridPlaceholder.append(myGrid, myPager);
                    myGrid.jqGrid({
                        datatype: "local",
                        cellsubmit: 'clientArray',
                        height: 100,
                        width: 1300,
                        colModel: [
                            { label: 'Cantidad', name: 'cantidad_menaje', index: 'cantidad_menaje', width: 120, sortable: false, sorttype: "int", editable: true, editrules: { required: true }, editoptions: { size: 10, maxlength: 5 } },
                            { label: 'Menaje', name: 'menaje', index: 'menaje', width: 300, sortable: false, sorttype: "int", editable: true, editrules: { required: true }, editoptions: { size: 50, maxlength: 100 } },
                            { label: 'Observaciones particulares del menaje', name: 'observaciones_menaje', index: 'observaciones_menaje', width: 750, sortable: false, sorttype: "int", editable: true, editrules: { required: true }, editoptions: { size: 10, maxlength: 10 } }
                        ],
                        pager: myPager,
                        loadonce: true,
                        //pgbuttons: false,
                        //pgtext: null,
                        viewrecords: false,
                        loadError: function (jqXHR, textStatus, errorThrown) {
                            alertError('Error al cargar el grid', 'HTTP message body (jqXHR.responseText): ' + '\n' + jqXHR.responseText);
                        }
                    });
                }
                //Initialization
                return {
                    init: publicInit
                }
            };

            var gridDin = new NewgJQGridInstance("jq1234", cellWhereAppendTheGrid);
            gridDin.init();

Я пробовал несколько способов отображения кнопок navGrid, но на данный момент ни один из них не работает.

Моим первым подходом было определение пейджера navGrid следующим образом: 

myGrid.navGrid(myPager,
                    // the buttons to appear on the toolbar of the grid
                    { edit: true, add: true, del: true, search: false, refresh: false, view: false, position: "left", cloneToTop: false },
                    // options for the Edit Dialog
                    {
                        url: 'clientArray',
                        editCaption: "Edición de elemento",
                        recreateForm: true,
                        beforeInitData: function () {
                        },
                        checkOnUpdate: false,
                        checkOnSubmit: false,
                        closeOnEscape: true,
                        beforeSubmit: function (postdata, form, oper) {
                            if (confirm('¿Deseas realmente modificar este registro?')) {
                                // do something
                                return [true, ''];
                            } else {
                                return [false, '¡La modificación no se ha guardado!'];
                            }
                        },
                        closeAfterEdit: true,
                        savekey: [true, 13],
                        errorTextFormat: function (data) {
                            return 'Error: ' + data.responseText;
                        }
                    },
                    // options for the Add Dialog
                    {
                        url: 'clientArray',
                        closeAfterAdd: true,
                        closeOnEscape: true,
                        recreateForm: true,
                        errorTextFormat: function (data) {
                            return 'Error: ' + data.responseText;
                        }
                    },
                    // options for the Delete Dailog
                    {
                        url: 'clientArray',
                        recreateForm: true,
                        closeOnEscape: true,
                        errorTextFormat: function (data) {
                            return 'Error: ' + data.responseText;
                        }
                    });

Этот случай не работал, поэтому я попробовал этот другой код более простой: 

myGrid.jqGrid('navGrid', myPager,
                        {
                            edit: true,
                            add: true,
                            del: true,
                            search: false,
                            searchtext: "Buscar",
                            refreshtext: "",
                            addtext: "Add",
                            edittext: "Editar",
                            deltext: "Delete"
                        },
                        {
                            multipleSearch: true
                        });

В навигационном пейджере все еще не появилось никаких кнопок.

Есть идеи, что может быть не так? Большое спасибо!

...