JQgrid如何修复"在没有数据/没有找到记录的消息显示时加载"消息

时间:2016-09-23 16:01:32

标签: javascript jquery jqgrid

我查看了一些示例here并将其合并到我的代码中。并显示找不到记录的消息。但是没有找到记录。我也会出现"正在加载" 消息

我该如何解决这个问题?

另外,当有记录返回时,是否可以显示返回的记录数?

这是我的代码

console.log(" bmSearchData "+bmSearchData);
var emptyMsgDiv = $('<div>No URLs have been loaded for evaluation.</div>');


  var $grid =    $(".search-result");


     $grid.jqGrid({
        url: bmSearchData,       

        /**url: "/echo/json/", */
        mtype: "POST",
       // data: mydata,
       datatype: "json",
       emptyrecords: "0 records found",
       postData: {
            json: JSON.stringify(mydata)
        },
        success: function(mydata, textStatus, jqXHR) {
              console.log(" data :" +mydata);  
               console.log(" data :" + bmUSearchData);  
        },
        colModel: [


            { name: 'FullName',label: 'Name', align:'left', width: 115,search: true },           
            { name: 'address',label: 'Address', align:'left', width: 85 ,search: false},
            { name: 'city',label: 'City', align:'left', width: 50 ,search: false},
            { name: 'state',label: 'State', align:'left', width: 20 ,search: true},
            { name: 'zip',label: 'Zip', align:'right', width: 25 ,search: false},           
           // { name: 'lastModifiedDateTime',label: 'Modified Date', align:'right', width: 45 ,search: false},


        ],
          additionalProperties: ["address", "city", "state","zip"],
            subGrid: true,
            subGridRowExpanded: function (subgridDivId, rowid) {
                var item = $(this).jqGrid("getLocalRow", rowid);
                $("#" + $.jgrid.jqID(subgridDivId)).html("<div class=\"col-md-1\"><b>Address: </b></div>" + item.address +
                    "<br/><div class=\"col-md-1\"><b>City: </b></div>" + item.city + "<br><div class=\"col-md-1\"> <b>Zip: </b></div>" + item.zip + "");
        },

        iconSet: "fontAwesome",
        loadonce: true,
        rownumbers: true,
        cmTemplate: { autoResizable: true, editable: true },
        autoResizing: { compact: true },
        forceClientSorting: true,
        sortname: "Symbol",
        //height:"auto",
        caption: "<b>Result List</b>",
        viewrecords: true,
        autowidth: true,  // set 'true' here
        shrinkToFit: true, // well, it's 'true' by default


        loadError: function (jqXHR, textStatus, errorThrown) {
                var p = $(this).jqGrid("getGridParam"),
                    $errorDiv = $(this.grid.eDiv),
                    $errorSpan = $errorDiv.children(".ui-jqgrid-error");

                $errorSpan.html("No Data Available");
                $errorDiv.show();
                if (p.errorDisplayTimeout) {
                    setTimeout(function () {
                        $errorSpan.empty();
                        $errorDiv.hide();
                    }, p.errorDisplayTimeout);
                }
            },    

        loadComplete: function () {
                var count = grid.getGridParam();
                    var ts = grid[0];
                    if (ts.p.reccount === 0) {
                        grid.hide();
                        emptyMsgDiv.show();
                    } else {
                        grid.show();
                        emptyMsgDiv.hide();
                    }


        }
    });



      $grid.jqGrid('filterToolbar', {stringResult: true, searchOnEnter: false, defaultSearch : "cn"});

    // place div with empty message insde of bdiv
            emptyMsgDiv.insertAfter($grid.parent());


       $(window).resize(function () {
            var outerwidth = $('#grid').width();
            $('.search-result').setGridWidth(outerwidth); // setGridWidth method sets a new width to the grid dynamically
       });

HTML

   <div class="col-md-10 col-sm-10">
       <div id="grid" style="margin:10px 0 20px 0">
        <table class="search-result" style=""></table>


       </div>   
    </div>

0 个答案:

没有答案