Data for Invisible Columns When Using Horizontal Bar Is Not Displayed

[husParticipant]

I am working on jqxgrid (Dynamic Column). Here is part of my code:

$("#jqxgrid").jqxGrid({	
     width: 566,
     source: dataAdapter,
     autoheight: true,
     columnsresize: true,
     sortable: false,
     columns: columns
 });

They sit in the success handler of the Ajax request. My code will make ajax request every 3 seconds, take the data in json format, and build the jqxgrid. That means it will keep re-generating the grid. However I am having strange situation. In first iteration, the data is displayed as expected. But for the next iteration, the data will be shown on the visible columns only. I have lots of columns, so the horizontal bar is there. The current visible column will show the data but not the invisible one. However if I scroll to the right, on the next iteration the data is displayed and the other invisible column will not have the data. I confirmed that I received all the data. And another interesting part is only the column which has the number is having the problem. The column which has characters is good. I try to change the datafield to string, int, also number but seems no luck as yet. I took days just to figure out this strange behavior. Hopefully somebody could help me. Thank you.

[husParticipant]

Solved by commenting the property width. Hope this helps somebody.

[DimitarParticipant]

Hello hus,

The width property should not cause any issues. Maybe there is something else in your code that is erroneous. If you wish, post a code snippet that is relevant to the issue and we might be able to help you solve it.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[husParticipant]

Hi Dimitar,

You are true. Even I don’t believe width causes the problem. I am using this setting

$("#jqxgrid").jqxGrid({	
	width: 566,
	height: 250,
	source: dataAdapter,
	//autoheight: true,
	columnsresize: true,
	sortable: false,
	columns: columns
});

I am beginning to believe that the autoheight causes the problem for me. Now everything works just fine. I can now see the data in invisible columns that I need to drag the scroll bar to see it. Any explanation on this? The problem when I used autoheight is not only the problem I mentioned earlier, plus when I try to re-size the column, it only re-sized the column virtually. But in fact the real divider (line of column) is still there.

Additional question: I put this code in AJAX request under success call back, so that means the grid is re-generated (whole the data and the grid). Is this right way to implement it? Or there is another way? Thank you in advance.

[husParticipant]

Hi Dimitar,

My thought is wrong. autoheight is not causing the problem. I still could not able to find the reason of the problem. But I found your solution in another forum and combine it with my code like down here

var parent = $("#jqxgrid").parent();
$("#jqxgrid").jqxGrid('destroy');
$("<div id='jqxgrid'></div>").appendTo(parent);
$("#jqxgrid").jqxGrid({	
        width: 566,
        height: 220,
        source: dataAdapter,
	//autoheight: true,
	columnsresize: true,
	sortable: false,
	columns: columns
	//shrinkToFit : false
});

and so far it works good.

[Author]

Posts