I have a total set of 10+ columns in my grid of which 3 are shown by default. When i try to show anything over 6 columns the table header breaks. See attached.
PS Ive already tried using grid resizing when i show/hide columns.
Another representation is an extension of the fiddle of column hiding - http://jsfiddle.net/0Lsjcxhr/
Several columns here can be found hidden by default, when i try unhiding them it does not work. In my case i am trying to do something similar by programatically showing several hidden columns. When i do the aforementioned, i can see the data associated to the column which i show but under the wrong column header! And when i show several columns part of the headers dissapear as illustrated in the screenshot i shared.
This worked out like a charm thanks! One followup question however. With the large number of columns this grid holds, is it possible to have a horizontal scrollbar for viewing the entire collection as opposed to meshing them together?
Robert,
You can accomplish this by using pixel based widths rather than the percentage widths. When using a percentage width the column will look at the size of its container and try to conform to that, and not be any larger. In that case scroll bars will never render. If you instead set pixel based widths then as soon as the total width of all of the columns exceeds that of the grid a scroll bar will render. If you would prefer not to set a width on each column individually then you can set the defaultColumnWidth property on the grid:
http://help.infragistics.com/jQuery/2014.2/ui.iggrid#options:defaultColumnWidth
Thanks, could the current column schema somehow intefere with other grid features? I am trying to use remote sorting with this schema but when i click on a column the grid makes no request to attempt at sorting. It does add the sort css class to the table header but nothing else.
Even if this does trigger the remote sort, i foresee problems because it will try to use the wrong key for the odata $orderby with the current column configuration.
Hello Robert,
It shouldn't be related to the remote sorting feature. Maybe your sorting implementation is incorrect, could you please have a look at the sample that is attached to my reply, which is showing how to implement remote sorting, grouping and paging. As you can see you can build an expression which will help you to easily get sorting "Mode", "Key" or filtering "Logic" also.
Code snippet:
I hope that you will gain from the sample.
Let me know about the results.
Encoding the slash would work for the sorting on the backend but unfortunately the grid seems to double encode the key when i send it back. For example when i use the key 'Attributes%2FServiceStatus' for 'Attributes/ServiceStatus' it sends 'orderby=Attributes%252FServiceStatus'. It encodes the percentage! Is there a way to disable this encoding for sorting params?
Hello,
I'm just following up to see if you need any further assistance with this issue. If so please let me know.
Could you just use underscore (_) instead. The slash symbol is special character for the urls. If you want to use the backslash you can use encode it by using encodeURIComponent. However using unbound columns and remote sorting is limitation and is not working. I believe that you are not using unbound columns, since you are telling this is working for you.
"The Sorting, Filtering, and Group By features do not work with unbound columns."
This isn't completely accurate, sorting works with unbound columns. The only limitation here is when you use special characters such as the '/' as a key. When i do this, the sorting works just fine however when i try to change the datasource of the grid on the fly, the grid breaks down.