Как предоставить идентификатор строки при использовании jqGrid 'editGridRow' для создания новой строки, а не сгенерированного автоматически идентификатора строки jqg1

Я новичок в jqGrid, так что, надеюсь, кто-то может указать мне в правильном направлении.

По сути, я использую jgGrid для отображения списка дат и затрат, которые я прочитал, из файла, который я хочу, чтобы пользователь мог изменять, добавлять новые записи или удалять существующие записи. После того, как пользователь нажал на экранную кнопку "Применить", чтобы отправить обратно форму, я зачитал jqGrid и отправил обратно на сервер в виде строки JSON.

Моя проблема заключается в том, что когда я добавляю новые строки (через editGridRow), jqGrid использует автоматически генерируемые jqg1, jg2, jg3 и т. Д., А новые строки заполняются в верхней части сетки, а не в позиции идентификатора строки, т.е. дно сетки.

Я могу генерировать RowID по мере необходимости, однако я, кажется, не могу предоставить их 'editGridRow' при создании новых записей, вместо этого мне кажется, что я должен использовать ключевое слово "new".

Как вы знаете, причина, по которой я использую editGridRow вместо addRowData, заключается в том, что editGridRow создает модальное диалоговое окно для ввода данных пользователем.

Любая помощь будет оценена.

This is what I would like to use to supply a row ID: $("#tableGrid").jqGrid('editGridRow', gridRowID, {reloadAfterSubmit:false});

This is what I have to use to get the code to work: $("#tableGrid").jqGrid('editGridRow', "new", {reloadAfterSubmit:false});

Вот фрагмент кода, который я использую для создания gqGrid в моем JSP:

var gridRowID = ${costHistoryEntries}.length

    $("document").ready(function() {

            $("#tableGrid").jqGrid({
                data: ${costHistoryEntries},
                datatype: "local", 
                height: 200, 
                colNames:['Date', 'Cost'],
                colModel:[ 
                        {name:'chdate', index:'chdate', width:110, sorttype:"date", editable:true, editrules:{date:true, required:true, custom:true, custom_func:checkDate}, datefmt:'d/m/Y'}, 
                        {name:'cost', index:'cost', width:160, align:"right", sorttype:"float", editable:true, editrules:{number:true, required:true}, formatter:'float'},
                ],
                autowidth: true,
                loadonce: true,
                sortname: 'chdate',
                sortorder: "desc", 
                rowList:[10, 20, 30],
                pager: jQuery('#tablePager'),
                viewrecords: true,
                editurl: '/myurl',
                caption: "Cost History Entries" }

            ); 

            $("#tableGrid").jqGrid('navGrid', "#tablePager", {edit:true, add:true, del:true, search:true, refresh:true});

            $("#addEntry").click(function() {
                gridRowID++;
                $("#tableGrid").jqGrid('editGridRow', "new", {reloadAfterSubmit:false});
            });
    });

Я также создал кнопку и связал ее с "addEntry" в качестве альтернативного способа добавления новой строки с помощью панели "add / edit / delete / find / reload" jqGrid Navigator. Как вы можете видеть до загрузки сетки данными, я сохранил количество записей в gridRowID. В функции щелчка "#addEntry" я надеялся использовать обновленный gridRowID в качестве параметра RowID.

Как к сведению: в предыдущей версии кода я использовал следующие данные для загрузки данных в сетку:

            var griddata = ${costHistoryEntries};
            for (var i=0; i <= griddata.length; i++) {
                $("#tableGrid").jqGrid('addRowData', i+1, griddata[i], "last");
            }

но обнаружил, что я мог бы сделать то же самое с

data: ${costHistoryEntries},

Обе версии правильно создают идентификаторы строк для предоставленных примеров данных с сервера: [{"chdate":"20/05/2011","cost":"0.111"},{"chdate":"01/06/2011","стоимость": "0,222"},{"chdate":"07/07/2011","стоимость": "0,333"}]

Моя проблема заключается в добавлении новых строк данных.

Дальнейшее обновление. На стороне сервера в качестве теста я перехватил сообщение в /myurl и обновил идентификатор с "_empty" до "7", но новая запись в jqGrid все еще имеет автоматически сгенерированный идентификатор строки jqGrid "jqg1":

Key = chdate, Value = 26/09/2011
Key = oper, Value = add
Key = cost, Value = 14
Key = id, Value = _empty

Updated Key = chdate, Value = 26/09/2011
Updated Key = oper, Value = add
Updated Key = cost, Value = 14
Updated Key = id, Value = 7

1 ответ

Я не совсем понимаю ваше требование. Вы получаете входные данные для jqGrid с сервера, но используете datatype: "local" вместо datatype: "json" например, который инструктирует jqGrid получать ajax-запрос к серверу для получения данных всякий раз, когда это необходимо. Кроме того, вы хотите сохранить дату на сервере, но использовать editurl: '/dummyurl' вместо реального URL сервера. editurl получит входные данные из $("#tableGrid").jqGrid('editGridRow', "new", {reloadAfterSubmit:false}); и должен отправить обратно идентификатор новой сгенерированной строки. Разве это не то, что вы хотите?

Так что мое предложение будет использовать какой-то сервер на основе datatype (мочалка datatype: "json") и таким же образом используйте реальный editurl которые сохраняют данные на сервере (в основном в базе данных) и помещают в ответ сервера идентификатор нового сгенерированного элемента данных.

ОБНОВЛЕНО: если вы используете reloadAfterSubmit: false Опция editGridRow вы должны использовать обработчик события afterSubmit вместе с reloadAfterSubmit которые декодируют ответ сервера и возвращают результат в формате [true,'',new_id] Например, если ваш сервер просто возвращает новый rowid в качестве данных, которые вы можете использовать

$("#tableGrid").jqGrid('editGridRow', "new",
    {
        reloadAfterSubmit: false,
        afterSubmit: function (response) {
            return [true, '', response.responseText];
        }
    }
);
Другие вопросы по тегам