jQuery кнопка обновления клика jqGrid только один раз

Question

У меня есть следующий код jQuery, который я использую для заполнения jqGrid. Он отлично работает при публикации на моей странице ASP.NET MVC по первому нажатию кнопки. My
проблема в том, что любые другие щелчки после первого, по-видимому, проходят через код jquery при нажатии кнопки, но никогда не попадают на страницу POST. Есть идеи почему?

<script type="text/javascript">

        $(document).ready(function() {
            $('#btnSubmit').click(function() {

                /* Refreshes the grid */
                $("#list").jqGrid({
                    /* The controller action to get the grid data from */
                    url: '/CRA/AddPart',
                    data: { partNumber: "123"},
                    datatype: 'json',
                    mtype: 'GET',
                    /* Define the headers on the grid */
                    colNames: ['col1', 'col2', 'col3', 'col4'],
                    /* Define what fields the row columns come from */
                    colModel: [
                  { name: 'col1', index: 'invid', width: 290 },
                  { name: 'col2', index: 'invdate', width: 290 },
                  { name: 'col3', index: 'amount', width: 290, align: 'right' },
                  { name: 'col4', index: 'tax', width: 290, align: 'right'}],
                    height: 'auto',
                    rowNum: 10,
                    rowList: [10, 20, 30],
                    sortname: 'id',
                    sortorder: "desc",
                    viewrecords: true,
                    imgpath: '../../Scripts/jgrid/themes/steel/images',
                    caption: 'Core Return Authorization Contents:',
                    cellEdit: true
                });
            });
        });

    </script>

Answer 1

Причина, по которой сетка не перезагружается, заключается в том, что вы вызываете неправильный метод. Метод jqGrid делает примерно это:

1. Изучите таблицу, чтобы увидеть, является ли она уже сеткой; если так, выход.
2. Преврати стол в сетку.
3. Заполните первую страницу данных.

Итак, во второй раз, когда вы вызываете метод, он ничего не делает, согласно шагу 1.

Вместо этого вы должны звонить $("#list").trigger("reloadGrid") во второй и все последующие клики.

Теперь, из-за вашего mtype в опциях сетки, сетка будет выполнять GET, а не POST. Поэтому, если POST исходит от самой кнопки (другими словами, это ввод типа submit), вы должны вернуть true, чтобы указать, что отправка должна продолжаться как обычно.

Answer 2

Вот решение:

<script type="text/javascript">
        var firstClick = true;
        $(document).ready(function() {
            $('#btnSubmit').click(function() {
                 if (!firstClick) {
                     $("#list").trigger("reloadGrid");
                 }
                 firstClick = false;
                /* Refreshes the grid */
                $("#list").jqGrid({
                    /* The controller action to get the grid data from */
                    url: '/CRA/AddPart',
                    data: { partNumber: "123"},
                    datatype: 'json',
                    mtype: 'GET',
                    /* Define the headers on the grid */
                    colNames: ['col1', 'col2', 'col3', 'col4'],
                    /* Define what fields the row columns come from */
                    colModel: [
                  { name: 'col1', index: 'invid', width: 290 },
                  { name: 'col2', index: 'invdate', width: 290 },
                  { name: 'col3', index: 'amount', width: 290, align: 'right' },
                  { name: 'col4', index: 'tax', width: 290, align: 'right'}],
                    height: 'auto',
                    rowNum: 10,
                    rowList: [10, 20, 30],
                    sortname: 'id',
                    sortorder: "desc",
                    viewrecords: true,
                    imgpath: '../../Scripts/jgrid/themes/steel/images',
                    caption: 'Core Return Authorization Contents:',
                    cellEdit: true
                });
            });
        });

    </script>

Answer 3

Поскольку мне нужно ПОСТАВИТЬ новые значения в действие, для меня не работает "reloadGrid".

Я просто удаляю все содержимое и снова создаю пустую таблицу.

ВЕсли я проверю, есть ли сетка, чтобы скрыть «пустой график» div (он показывает только сообщение).В остальном я просто очищаю div, который окружает таблицу, а затем снова добавляю в таблицу.Когда плагин находит пустую таблицу, он снова полностью загружает сетку.

LoadTableData - это функция, которая имеет общие функции для создания и загрузки сетки.

Возможно, это решение не элегантно,но когда время идет ...

$("#btnDownloadsPerFile").click(function () {
            if ($('#chartContainerDownloadsPerFile .ui-jqgrid').length == 0) {
                $('#chartContainerDownloadsPerFile .emptyChart').hide();
            }
            else {
                $('#chartContainerDownloadsPerFile').empty();
                $('#chartContainerDownloadsPerFile').append('<table id="downloadsPerFileGrid"></table>');
            }
            LoadTableData("downloadsPerFileGrid", $('#ddlportalOptionsDownloadsPerFile').val(), "downloadsPerFile", $('#ddlTimeOptionsDownloadsPerFile').val(), $('#ddlTimeValuesDownloadsPerFile').val(), $('#ddlCountries').val());
        });