代码之家  ›  专栏  ›  技术社区  ›  JK.

jQuery jqGrid触发器重载grid

  •  5
  • JK.  · 技术社区  · 16 年前

    我用的是 jqGrid 以显示搜索结果。单击搜索按钮时,它会执行以下操作:

    $("#Search").jqGrid('setGridParam', { url: url }).trigger("reloadGrid");
    

    哪里 url 包含搜索参数,例如:

    var url ="/search?first=joe&last=smith"
    

    web服务器正在接收此URL并做出相应响应。但在客户端,它在jqgrid中抛出了这个错误。min.js第21行:

    Syntax error:    
    }); b.fn.jqGrid = function(f) { 
    

    我能做些什么来解决这个问题?我在许多其他地方成功地使用了jqGrid,但这是唯一一个我更改URL并重新加载的地方。

    4 回复  |  直到 15 年前
        1
  •  2
  •   Dan Heberden    16 年前

    尝试使用本页面上的非缩略版本,以了解其周围环境的更多内容。你所看到的是一个语法分析停止的地方;我怀疑你的错误更严重。通过这种方式,您可以查看当前url是否正在使用,以及是什么导致了它的丢失。

        2
  •  1
  •   Oleg    16 年前

    在我看来,jqgrid中的错误。min.js对应于jqGrid direct的未压缩版本在 .jqGrid('setGridParam', { url: url }) (见第82行) 网格基础js )它是jqGrid 3.6版本中引入的所谓“新API”的一部分。代码片段从以下几行开始:

    $.fn.jqGrid = function( pin ) {
        if (typeof pin == 'string') {
            var fn = $.fn.jqGrid[pin];
            if (!fn) {
                throw ("jqGrid - No such method: " + pin);
            }
            var args = $.makeArray(arguments).slice(1);
            return fn.apply(this,args);
        }
    //...
    

    我不知道你为什么会有“语法错误”,但我建议你验证一下,网格的id真的是“搜索”。如果没有发现错误,请在问题中添加更多信息。例如:您使用哪个版本的jQuery?包括代码片段和加载的Java脚本顺序也会很有帮助。

        3
  •  0
  •   David    16 年前

    与其设置url,不如尝试以下方法。

    我使用这个自定义下拉列表添加到网格中。基本上,我有条件地在网格的顶部工具栏部分添加两个下拉列表,以便快速搜索。

    var toolbarspan = $("<span>");
    
        if (tblDef.State != null) {
            $("<label>").attr("for", "selectState").append(" State: ").appendTo("#t_colch")
            $("<select>").attr("id", "selectState")
                .append($("<option>").attr({selected: true, value: "O"}).append("Open"))
                .append($("<option>").attr("value", "C").append("Closed"))
                .append($("<option>").attr("value", "B").append("Both"))
                .change(selChange)
                .appendTo("#t_colch")
           }
    
        $("<label>").attr("for", "selectInActive").append(" InActive: ").appendTo("#t_colch")
            $("<select>").attr("id", "selectInActive")
                .append($("<option>").attr({selected: true, value: "0"}).append("Active"))
                .append($("<option>").attr("value", "1").append("InActive"))
                .append($("<option>").attr("value", "B").append("Both"))
                .change(selChange)
                .appendTo("#t_colch");
    
        }
    

    如果您想在顶部工具栏中同时显示两个字段,则需要在表格选项中添加以下内容。

     toolbar: [true, "top"],
    

    首先将其添加到表定义中。

    beforeRequest: myBeforeRequest(this),
    

    然后像这样定义myBeforeRequest函数。

    function myBeforeRequest(grid) {
        $(grid).jqGrid("setPostDataItem", "InActive", 0);
        var chkVal="";
        if ($("#selectInActive").length > 0)
        {
            chkVal = $("#selectInActive").val();
            if (chkVal == "B") $(grid).jqGrid("removePostDataItem", "InActive");
            else $(grid).jqGrid("setPostDataItem", "InActive", chkVal);
        }
        if (tblDef.State != null) {
            $(grid).jqGrid("setPostDataItem", "StateCol",  tblDef.State);
            $(grid).jqGrid("setPostDataItem", "State", "O");
            if($("#selectState").length > 0)
            {
                chkVal = $("#selectState").val();
                if (chkVal == "B") $(grid).jqGrid("removePostDataItem", "State");
                else $(grid).jqGrid("setPostDataItem", "State", chkVal);        
            }
        }
        }
    

    您可以对两个搜索字段执行相同的操作,如果它们为空,甚至可以从参数中清除它们。这将导致与您现在手动编辑的url相同。 获取记录。aspx?非活动=0&状态=O&StateCol=9是我目前在服务器上得到的结果。

        4
  •  0
  •   Ro.    16 年前

    刷新方法对我来说没问题。 它会刷新每次通话的日期(往返时间)。

    最后两行代码发挥了所有的魔力。

    我是这样使用它的:

    function refreshGrid() {    
    
        var gridSel = "#analyticsTbl";
        var fromDt = jQuery('#dpFrom').datepicker().val();
        var toDt = jQuery('#dpTo').val();
    
        var url = 'myService.asmx/MyWebMethod?fromdt=' + fromDt + '&' + 'todt=' + toDt;
    
    
        jQuery(gridSel).jqGrid({
            url: url,
            mtype: "GET",
            datatype: "xml",
            colNames: ['Product', 'Group', 'Score', 'Date'],
            colModel: [
                       { name: 'Product',  index: 'Product', sortable: true },
                       { name: 'Group', index: 'Group', sortable: true },
                       { name: 'Score', index: 'Score', sortable: true },
                       { name: 'Date', index: 'Date', sortable: true }
                      ],
            viewrecords: true,
            sortorder: "desc",
            caption: "Report",       
            hidegrid: false,
            autowidth: true,
            height: "100%"
    
        });
    
        jQuery(gridSel).jqGrid('navGrid', '#pgwidth', { edit: false, add: false, del: false });
    
    
        jQuery(gridSel).jqGrid('setGridParam', { url: url });
        jQuery(gridSel).trigger("reloadGrid");
    }