如何在jqGrid中显示没有任何数据的信息?

11 javascript jqgrid

当jqGrid为空时,我想在网格内显示单个空行,并显示没有任何数据的信息消息.这怎么可能?谢谢

小智 9

我正在寻找这个问题的答案,并提出了以下解决方案,但我不是在与服务器通信,因此我必须使用"loadComplete"事件之外的其他内容.我迷上了'gridComplete'事件并检查是否有任何记录.如果没有,请显示空文本,否则将其隐藏.

jQuery('#test').jqGrid({
        ... // some settings
        gridComplete: loadCompleteFunction,
        emptyDataText:'There are no records. If you would like to add one, click the "Add New ..." button below.', // you can name this parameter whatever you want.
        ... // more settings

});

function LoadComplete()
{
    if ($('test').getGridParam('records') == 0) // are there any records?
        DisplayEmptyText(true);
    else
        DisplayEmptyText(false);
}

function DisplayEmptyText( display)
{
    var grid = $('#test');
    var emptyText = grid.getGridParam('emptyDataText'); // get the empty text
    var container = grid.parents('.ui-jqgrid-view'); // find the grid's container
    if (display) {
        container.find('.ui-jqgrid-hdiv, .ui-jqgrid-bdiv').hide(); // hide the column headers and the cells below
        container.find('.ui-jqgrid-titlebar').after('' + emptyText + ''); // insert the empty data text
    }
    else {
        container.find('.ui-jqgrid-hdiv, .ui-jqgrid-bdiv').show(); // show the column headers
        container.find('#EmptyData' + dataObject).remove(); // remove the empty data text
    }
}


Jac*_*son 1

棘手的一点是让消息分布在各列中。我认为没有简单的方法可以做到这一点;例如,您必须隐藏除第一列之外的所有列,设置第一列的宽度以填充网格,然后将消息放在第一列中。然后当你重新加载时,你必须撤消所有这些。它应该可以工作,但是有点混乱。

但是,假设您只想将消息放入第一列并将其余部分留空。基本上,您实现“loadComplete”事件函数并操作网格的内容。

向网格对象添加一个属性,如下所示:

//Various other grid properties...
loadComplete: function() {
     if (jQuery("#grid_id").getGridParam("records")==0) {
          jQuery("#grid_id").addRowData(
                "blankRow", {"firstCol":"No data was found". "secondCol":"", "thirdCol":""
          );
     }
}
Run Code Online (Sandbox Code Playgroud)

其中“#grid_id”是网格容器的 ID,“blankRow”是您为添加的新行指定的任意 ID,“firstCol”、“secondCol”等是列的名称。