Question

我有以下jQuery代码，我用它来填充jqGrid。在第一次单击按钮时，它可以完美地发布到我的ASP.NET MVC页面。我
问题是，当点击按钮时，任何其他点击超过第一个点击它似乎通过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所示。

相反，您应该在第二次和所有后续点击时调用$("#list").trigger("reloadGrid")。

现在，由于你在网格选项中的mtype，网格将进行GET，而不是POST。因此，如果POST来自按钮本身（换句话说，它是提交类型的输入），则应返回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

因为我需要将新值发布到Action中，所以它不起作用“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());
        });

jQuery按钮单击刷新jqGrid只触发一次

3 个答案: