CODEWITHSUNDEEP
javascriptjqueryjqgrid
PaperBirdMaster
PaperBirdMaster

Reputation: 13298

jqGrid table is filled but no rows are displayed

I have a problem with a jqGrid table that i'm unable to find a solution nor an answer that guides me in the correct direction, i've read some answers in SO but none of them focuses on my problem:

Many of the related questions that i've read so far focuses on populating the grid with JSON data, but that's not my case. The way i fill the grid is with the addRowData method, and it seems to work, because when i inspect the table element on the debug tools of the browser (Chrome 29.0.1547.76 m) and the table, tbody plus all the tr elements exists with the expected data, but they aren't visible!

inspection screenshot

All the rows have the width and height with 0px value, that's why (i suppose) the data doesn't show. But i use the same method to display another tables and the result is visible.

I cannot paste all the code because is messy and spagetty, but i'll try to provide useful information:

// The ConvertTojqGrid method converts the data (array object)
// into the format expected by jqGrid in order to provide the
// colModel and rows
var jqGridData = ConvertTojqGrid(data);

// the divID begins with '#'
var div = jQuery(divID)[0];
var table = divID + '_table'

jQuery(divID).append('<table id="' + table.substr(1) + '"></table>');
// get rid of the '#' in the string  ^^^^^^^^^^^^^^^

jQuery(table).jqGrid(
{
  autowidth: true,
  gridview: true,
  headertitles: true,
  datatype: 'clientSide',
  caption: gridCaption,
  colModel: jqGridData.colModel,
  records: jqGridData.rows.length,
  height: div.clientHeight,
  width: div.clientWidth
});

jqGridData.rows.forEach(function(row)
{
  jQuery(table).addRowData('row_id', row);
});

The webpage shows a table with data that is displayed as expected but with some columns hidden, on top left of the table a button is placed, this button shows a form with another grid that displays the same table without hidden columns.

All the tables are placed into a runtime-generated div and into this div a table tag is generated in order to contain the grid.

In brief, the problem isn't in obtaining the data nor in filling the table, the problem is that the data is correct and the table is filled but the rows aren't visible.

Any advice will be wellcome.

Upvotes: 0

Views: 1257

Answers (1)

Adam Morris
Adam Morris

Reputation: 8545

Try in your jqGrid definition setting datatype: "local".

If that doesn't work, what does your colModel look like, and do you have a sample of the data format you're using to populate a row?

Upvotes: 1

Related Questions