jqxGrid, how to use set its width like table can use %, then it can automatic resize upon container size change

[tata20011125Member]

e.g. width: “100%”

then its width can be automatic changed when container size change.

 

[Peter StoevKeymaster]

The Grid widget works with fixed width only which is specified by its ‘width’ property. It is not possible to set its width in percentages in this version. We’ll implement the requested feature for a future version.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[tata20011125Member]

@Peter Stoev

thanks for your reply, I expect the width value alike table width, both number or percentage are OK.
by the way, Grid is a great widget.

[gradualstudentMember]

This would be useful when added.

[Peter StoevKeymaster]

It is already added. You can set the Grid’s width and height to percentage value. You can also set the columns width property to a percentage value.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[gradualstudentMember]

Aha, see it now. Works brilliantly.

[Ray ChoeParticipant]

is there way that I can see sample code to see how it works?
I’ve been using jqxGrid all over my web site, but the issue is that content is not fit into the column size so it chopped off.

I thought it is auto adjust the column height.

please help!

[Peter StoevKeymaster]

Hi Ray,

Not sure about the issue you are talking about. Would you like to send us a sample?

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[maurizioParticipant]

Hi Peter

Apologies for hijacking the post but I tried to set the grid’s width to 100% but it does not seem to work. I am using version 2.5. Was this functionality added in a successive version?

Thanks
Maurizio

[Peter StoevKeymaster]

Hi Maurizio,

Check that with the current version – jQWidgets 2.7. For example, the Grid’s width and height in the Tab’s integration sample is set to 100% and also in the Grid’s sample in the Mobile Demos section.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[mirko.luganoParticipant]

Hi Everybody,
sorry for re-opening this thread, but I have ran into a strange issue with percentages. I am using version 3.0.4 (just downloaded it today (11 nov ’13)) and I noticed (as stated before in this thread) that I can set the width of the grid using percentages as well. The point is, I can also set percentages with decimals (e.g. 30.5%) for the Grid, but not for the single columns. Here is a snippet taken from the jqwidgets demos under /demos/jqxgrid/autosize.html: (I have added comments)

$(“#jqxgrid”).jqxGrid(
{
width: ‘50%’, //here I can set for instance 50.5% <——–
height: '50%',
source: dataAdapter,
showfilterrow: true,
filterable: true,
theme: theme,
selectionmode: 'multiplecellsextended',
columns: [
{ text: 'Name', columntype: 'textbox', datafield: 'name', width: '20%' }, //here I cannot set 20.5% <———
{
text: 'Product', datafield: 'productname', width: '35%'
},
{ text: 'Ship Date', datafield: 'date', filtertype: 'date', width: '30%', cellsalign: 'right', cellsformat: 'd' },
{ text: 'Qty.', datafield: 'quantity', width: '15%', cellsalign: 'right' }
]
});

that means, the percentage value of the single column will always be 20, regardless wehter I enter 20% or 20.5% or even a string like 20.abced%. I would like to ask if this is a known issue and wether it is possible to fix it in future releases.
I have tested this on the latest versions (as of today) of chrome and firefox.
Thank you and BTW great widget!
Mirko

[Peter StoevKeymaster]

Hi Mirko,

Percentages are expected to be Integers. Floating Point Percentage values are currently not supported for column widths.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[cirrusParticipant]

Hi guys,

I am trying to fit the table in a page which shows some information inside a desktop app. I need to set the width and height to 80% of the page and keep this proportion all the time. Using the following code I managed to do this with width but height is just not working. If I set the autoheight to true then the table goes beyond the page size and I have to scroll to the end of the page to see the horizontal scroll bar in the table. Basically I want to see the horizontal and vertical scroll bars in the table all the time. Any help would be most appreciated. -Thanks

$(“#jqxgrid”).jqxGrid(
{
width: “100%”, <!–pass in as variable–>
height: “80%”,
source: dataAdapter,
sortable: true,
//autoheight: false,
autoloadstate: true,
autosavestate: true,
columnsresize: true,
columnsreorder: true,
showfilterrow: true,
filterable: true,
altrows: true,
//groupsrenderer: groupsrenderer,
groupsexpandedbydefault: true,
groupable: true,
showgroupsheader: false,

[Peter StoevKeymaster]

Hi cirrus,

Is the Grid’s parent HTML element with fixed height? I am asking due to the reason that 80% x 0 = 0 and you can’t have 80% of nothing. This sample shows how to set the widget’s height in percentages: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/autosize.htm. Also all the Mobile Demos about jqxGrid are with size in percentages.

Best Regards,
Peter Stoev

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

[ioanaParticipant]

Hello jqWidgets Team,

I am using latest jqxGrid version (3.7.0). Is Floating Point Percentage column width supported in this version? It does not seem to work.

Regards
Ioana

[Author]

Posts