jqGrid without header

Question

I have tried to figure out how to disable the header for a jqGrid, so that the row containing the column names does not show. So far, I have come up with no solution. Is there any way to do this?

Cynewulf

Answer 1

I don't see that the plugin gives you any options for this, but you could simply find and hide the container for the header.

...set up grid...

$('.ui-jqgrid-hdiv').hide();

Tactical

Answer 2

Omitting the 'caption' property hides the header.

Very late I know, but for someone still wanting to know. This was found after looking through the source.

Manuscript

Like this much better than abusing JavaScript – Estop

This answer is wrong. The question was not about hiding the caption but how to hide the column's names. The accepted answer is the correct. – Heatherheatherly

@PavlosPapanikolaou I agree with your comment. After testing it on jsFiddle it no longer works. Not too sure now whether I misunderstood the question in the first instance or whether there was a bug that had been fixed since. – Manuscript

Answer 3

This works:

var grid = $("#GRID_NAME");
var gview = grid.parents("div.ui-jqgrid-view");
gview.children("div.ui-jqgrid-hdiv").hide();

Computer

Answer 4

Not sure why no-one has come up with the CSS solution yet...

.ui-jqgrid-hdiv {
  display:none !important;
}

You can scope it using a wrapper container for a single instance if you have other grids that shouldn't be affected.

Tolle

IMHO this is the best solution – Execratory

Answer 5

This code works for me for jqGrid version 5.7

var tableId = document.getElementById('gridTablId').getAttribute("aria-labelledby");
document.querySelector("#" + tableId + " .ui-jqgrid-htable thead").style.display = "none";

Thanet

Answer 6

There is an option for this: hidegrid: false

look at following Is it possible to remove the expand/collapse button from the jqGrid header?

Emancipate

This does not solve my problem. According to the jqGrid documentation, the hidegrid option "Enables or disables the show/hide grid button, which appears on the right side of the Caption layer. Takes effect only if the caption property is not an empty string." – Cynewulf