如何删除(或隐藏)jqgrid中的标题栏？

Question

我看到你可以添加一个顶部标题栏并使用以下代码放置标题:

jQuery('#grid').setCaption("Title");

无论如何,如果我已经设置了标题,删除标题栏？

我试过这个,但它只删除了文本(不删除整个标题栏).

jQuery('#grid').setCaption("");

Answer 1

如果你想快点,试试

$(".ui-jqgrid-titlebar").hide();

或者如果你有多个网格,那么只隐藏$("#grid")的标题栏,然后执行

$("#gview_grid > .ui-jqgrid-titlebar").hide()

Answer 2

如果您创建没有标题栏的jqGrid(caption: "")并检查关于开发人员工具或关于Firebug的网格,您将看到<div>类"ui-jqgrid-titlebar" <span>与类"ui-jqgrid-title"和带有"ui-jqgrid-titlebar-close"类的锚作为子元素:

<div id="gbox_list" class="ui-jqgrid ui-widget ui-widget-content ui-corner-all">
    ...
    <div id="gview_list" class="ui-jqgrid-view">
        <div style="display: none;"
             class="ui-jqgrid-titlebar ui-widget-header ui-corner-top ui-helper-clearfix">
            <a style="right: 0px;" class="ui-jqgrid-titlebar-close HeaderButton"
               role="link" href="javascript:void(0)">
                <span class="ui-icon ui-icon-circle-triangle-n"></span>
            </a>
            <span class="ui-jqgrid-title"></span>
        </div>
        ...

因此,即使您创建没有标题栏的网格,jqGrid也会创建标题栏的所有隐藏元素.

我查看了创建标题的jqGrid代码,可以找到以下片段

if(ts.p.caption) {
    ...
    $(".ui-jqgrid-titlebar-close",grid.cDiv).click( function(e){
    ...
} else {$(grid.cDiv).hide();}

因此,要获得与使用caption: ""参数初始化的网格相同的结果,您可以执行以下操作

var mygrid = jQuery('#list'),
    cDiv = mygrid[0].grid.cDiv;
mygrid.setCaption("");
$("a.ui-jqgrid-titlebar-close",cDiv).unbind();
$(cDiv).hide();

只有在您确定网格稍后没有标题(caption)时,才应该从最小化按钮解除绑定.绑定占用的资源较少,对隐藏的网格无效.

因此Pravat Maskey隐瞒标题的建议绝对正确,我的调查只证实了这一点.