jQuery Grid Plugin - jqGridForum

Topic RSS

removing column header row

07/05/2011
08:43

kobruleht

Member

Members

Forum Posts: 144

Member Since:
05/05/2011

Offline

Single column treegrid shows grid header row. Setting colNames: ["id", "", "url"], shows blank header. How to remove column header, so that treeGrid appears more like traditional tree ?

$("#west-grid").jqGrid({
     url: '<%= ResolveUrl("~/Store/GridData")%>',
     datatype: "json",
     mtype: "POST",
       height: "auto",
     pager: false,
   loadui: "disable",
   treeGridModel: "adjacency",
   colNames: ["id", "", "url"],
     colModel: [
            { name: "id", width: 1, hidden: true, key: true },
            { name: "menu" },
            {name: "url", width: 1, hidden: true }
                    ],
                autowidth: true,
                treeGrid: true,
                ExpandColumn: "menu",
                rowNum: 200,
                ExpandColClick: true,
                treeIcons: { leaf: 'ui-icon-document-b' },
                onSelectRow: function (rowid) {
                    var treedata = $("#west-grid").jqGrid('getRowData', rowid);
                    if (treedata.isLeaf == "true") {
                        window.location = '<%= ResolveUrl("~/")%>' + treedata.url;
                    }
                }

}
);

07/05/2011
13:32

OlegK

Germany

Member

Members

Forum Posts: 1255

Member Since:
10/08/2009

Offline

You can find here the description of the jqGrid elemens. There are gvew div which contain both grid body and grid headers. You cen get the gview with the code

var grid = $("#west-grid");
var gview = grid.parents("div.ui-jqgrid-view");

oder with

var grid = $("#west-grid");
var gview = $("#gview_"+grid[0].id);

To disable (to hide) the column headers of jqGrid you should do the following:

gview.children("div.ui-jqgrid-hdiv").hide();

The hiding of the column headers can have sense only if like in your case there are only one visible column in the grid.

By the way you don't need to define pager: false parameter of jqGrid. Exactly like you not defined caption parameter you can just not define the pager parameter.

Best regards
Oleg

07/05/2011
15:45

kobruleht

Member

Members

Forum Posts: 144

Member Since:
05/05/2011

Offline

I havent found any event whichg occurs only once after grid is constructed. So I used:

lloadComplete: function (rowid) {
var grid = $("#west-grid");
var gview = grid.parents("div.ui-jqgrid-view");
gview.children("div.ui-jqgrid-hdiv").hide();
},

Is this best place to remove header ?

07/05/2011
18:26

OlegK

Germany

Member

Members

Forum Posts: 1255

Member Since:
10/08/2009

Offline

You can execute the code which I suggested you before directly after the jqGrid will be created.

var grid = $("#west-grid");
grid.jqGrid({
// all jqGrid parameters
});
grid.parents("div.ui-jqgrid-view").children("div.ui-jqgrid-hdiv").hide();

Best regards
Oleg

07/05/2011
22:02

kobruleht

Member

Members

Forum Posts: 144

Member Since:
05/05/2011

Offline

Thank you. It works.

I noticed that if some item is clicked in tree, treeview changes its width. How to disable this so that treeview width does not change if clicked in item ?

Andrus.

All RSS

Forum Timezone: Europe/Sofia

Most Users Ever Online: 715

Currently Online:
41 Guest(s)

Currently Browsing this Page:
1 Guest(s)