Jqx Grid is shrinking

[nagaveniParticipant]

I am using jqx Grid and its columns are shrinking automatically when I call rebinding or also clicking on F12 key.

My Grid Settings are.

width:’100%’,
autorowheight:true,
autoheight: true,
theme:’arctic’,
editable:true,
sortable:true,
filterable: false,
showfilterrow: false,
altrows: true,
enabletooltips: true,
columnsresize: true,
columnsreorder: true,
enablehover: false,
selectionmode: ‘singlecell’,
ShowSortColumnBackground: false,
showfiltercolumnbackground: false”

And I am setting column’s width in terms of percentage. For e.g. width: ‘7%’

In my page, I need to bind grid regularly based on my scenarios and I am calling method to rebind that jqxGrid.
Its losing 100% width and columns are shrinking. So, I need to refresh the page to get full width. This is happening frequently.

Please provide us solution to fix this issue asap.

Thanks

[HristoParticipant]

Hello nagaveni,

Please take a look this example: http://jsfiddle.net/hristoxux/wgtnd4hb/
We were unable to reproduce this issue.
Could you share some example in jseditor/fiddle for better analyze.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[HristoParticipant]

Hello,

I hope it is fine.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[nagaveniParticipant]

Hello,

Previously I discussed this jqx Grid columns shrink issue but not fixed that one. But Now, I need to fix this columns shrink issue and I checked the above given sample. I observed the following code

$(‘#jqxgrid’).jqxGrid(‘updatebounddata’);

But this one is for only refreshing the grid and not for refreshing data. In my scenario, I have create and update records. I am calling grid binding method once the record is created/updated to update the grid.

My Grid binding sample code is like below.

var source =
{
localdata: source,
datatype: “json”,
datafields: DataFields,
id: ‘ID’
};
var dataAdapter = new $.jqx.dataAdapter(source);

$(“#TestGrid”).jqxGrid( width: ‘100%’, source: source: dataAdapter );

My grid columns settings are like below.

text: ”, datafield: ‘none’, width: ‘7%’, editable: false, filterable: false, pinned:true,cellclassname: cellclass
text: ”, datafield: ”, width: ‘3%’, editable: false
text: ‘Type’, datafield: ‘Type’, filtertype: ‘input’, editable: false, width: ‘6%’,cellclassname: cellclass
text: ‘Name’, datafield: ‘Name’, filtertype: ‘input’, editable: false, width: ‘14%’,cellclassname: cellclass
text: ‘Address’, datafield: ‘Address’, filtertype: ‘input’, editable: false, width: ‘14%’, cellclassname: cellclass
text: ‘Email’, datafield: ‘Email’, filtertype: ‘input’, editable: false, width: ‘17%’, cellclassname:cellclass
text: ‘Phone’, datafield: ‘Phone’, filtertype: ‘input’, editable: false, width: ‘10%’, cellclassname:cellclass
text: ‘Alternate Phone’, datafield: ‘APhone’, filtertype: ‘input’, editable: false, width: ‘10%’, cellclassname:cellclass
text: ‘Notes’, datafield: ‘Notes’, filtertype: ‘input’, editable: false, width: ‘19%’, cellclassname:cellclass

Please provide me solution to fix this column shrink issue.

[Peter StoevKeymaster]

Hi nagaveni,

Columns will shrink and grow when the columns width is in percentages.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts