I am facing issue on resizing the jqgrid headers. When i try to resize them, the headers dont match with the actual row data(as seen in the snap below).
I want the header rows to resize along with the data rows.
Please help.
I have uploaded the image on the following link: Image-describing-shrink-issue
Thanks,
AP
For changing Column Header width in jqgrid use below code
$('.ui-jqgrid-labels > th:eq(2)').css('width','400px');
For changing Column cells width in jqgrid use below code
$('#gridId tr').find("td:eq(2)").each(function(){$(this).css('width','400px');});
How to change header and column width in jqgrid code example.
Related
I use primefaces 5.2 and jsf 2.2.6 and I get a wrong width value in the columnResizeEvent when resizing the columns.
For the datatable I use the attribute resizeMode="expand", because I want to keep the size of the other columns the same when resizing a column.
But the problem is when I want the decrease the width of a column, I get a bigger value than the previous one, even though I decreased the width and even though in the user interface the column appears to have a smaller width as I want it to be.
When I don't use the attribute resizeMode on the datatable, the provided width from the ColumnResizeEvent is correct, but the size of the other columns are changed and I don't want that.
Is there a way to resize a column and keep the sizes of the others and at the same time to get a correct value of the column width?
So, it seemed that the problem was the widgetVar from the datatable, because I had several tables with the same value in the widgetVar for every single datatable and that's why it had the same clientId, because the same clientId was added to the DOM.
To find out more about the problem and solution, you can visit another post of mine, in which I want to use the same xhtml with a datatable for multiple tabs:
How to use the same datatable for all the tabs primefaces (resize not working in this case)
I have a dynamic Kendo grid, for which I get the data every time from the server with the column configuration. The grids renders the data as expected, but sometimes the grid does not render the data at all and only renders the column headers. The grid does not even recognize the column configuration, which mentions whether the column is hidden or not, column title etc.
When I refresh(ctrl+f5) the browser page the grids starts displaying normally.
When I checked the html generated in both cases I saw following difference
1- The Grid which displays correctly
Has a thead and tbody inside a single table
2- The Grid which does not display the data
Has two different divs for header and content
Please see the following image for Good Grid
And following image for Bad Grid
I am not sure why the same grid has two different htmls? Can anyone please help?
EDIT
One more thing that might be helpful.
The kendo grid definition is in a content.html file. And this file is used as a content URL for kendo tabstrip control. There are around 7 tabs and all the tabs are refering to the same content file.
I am trying to adjust the width of column in jqgrid with the size of text in that column.
I didn't find a solution by searching.
I tried the solution at this question: jqgrid column width auto. I have problem with the header now. When there is no horizontal scroll in the jqgrid the header is shorter than the body. Any idea?
Some time ago I wrote small jqGrid plugin with setColWidth method. It do what you need. The last version of the method you can download from github (jQuery.jqGrid.setColWidth.js file). In the answer there are an example of usage of the method. Another demo created for the answer demonstrates the usage of the method to set the width of every columns of the grid based on the width of maximal width of content in the column and in the column header.
I want to add a header to my JQgrid without pushing a custom div right above my grid. I found the caption option which appears to create a header that looks good. However, right below the header another div appears which is ~4x the height of the header. This looks to simply be a div that allows a user to hide or unhide the entire grid.
Question 1: Is this hide/unhide supposed to be this big? My height and width are both set to auto for the grid.
Question 2: Is there a way to easily remove this hide/unhide area?
If you think you need source code or an image to show the problem let me know and I'll post it. It needs to be scrubbed of company data first, hence me not putting it in the initial post.
Is this the same issue as Large header in jqGrid?
Both answers include workarounds to get rid of the huge header.
I need to resize the JQGrid column at runtime.
For eg: the column width for the column was 100px when it is loaded. I need to change it to 200 afterwards.
Please help.
Unfortunately there is no way to do this using the jqGrid API. From the documentation:
As mentioned above the options in colModel can be get or set using the methods getColProp and setColProp. Below are options which can not be changed dynamically when the grid is constructed (If changed they do not have effect or will cause the grid errors). For some of these options there are methods available to change the value:
name
width
resizable
label (method avail.)