Hi,
Couple problems I need help on:
- Is it possible to add custom attribute to <td> tags inside igGrid ? I need to know what kind of data is inside that cell, so ideally I want to add attribute corresponding to the column key, something like: <td data-type="Price"></td>.
- Is it possible to change column setting property on the fly ? For instance, I need column A to be read only when rendered, but based on user input on editing, I want to change column A to be editable.
Thanks,
Jeffrey
Hi Jeffrey,
jAndika said:- Is it possible to add custom attribute to <td> tags inside igGrid ? I need to know what kind of data is inside that cell, so ideally I want to add attribute corresponding to the column key, something like: <td data-type="Price"></td>.
Yes, you can. You can see that we use data-id attributes on the TR elements to indicate the primary key value of the row.
jAndika said:- Is it possible to change column setting property on the fly ? For instance, I need column A to be read only when rendered, but based on user input on editing, I want to change column A to be editable.
I'm afraid that you cannot set readOnly column setting on the fly, but you can set a cell in edit mode to be read only. First you should bind to editCellStarted event. In the event use ui.editor parameter to gain access to the igEditor, then set igEditor to be read only.
Here is an example code:
Hope this helps,
Martin Pavlov
Infragistics, Inc.
Martin,
I've figured out a way to add attribute by looping through rows with data-id like so:
$('#gridMatrixLineItem tr[data-id]').each(function (index, element) {
//loop through the element children which is the column cells, add attributes
});
How are you guys doing it ?
I'd like to add one more related question..
I used that function above to add background color for specific cells inside the grid. When I hide a column, the color dissapear, so I figured I should re-apply the color inside columnHidden event handler.
When I inspect the cells using google chrome dev tools the background color is there, however, when the grid rendered the background color is not there anymore. Is there another event fired after columnHidden when hiding a grid column that would override my color attribute ?
As far as setting readOnly on the fly, another infragistics team suggested to hide/show the ui.editor which works for me.
Thanks for the help.
jAndika said: I've figured out a way to add attribute by looping through rows with data-id like so: $('#gridMatrixLineItem tr[data-id]').each(function (index, element) { //loop through the element children which is the column cells, add attributes }); How are you guys doing it ?
You can try to use row templating. Your solution looks fine, but that's only part of the story, because it doesn't handle igGrid features integration. As with your case you also have Hiding feature. Hiding feature rerenders igGrid TBODY when column is hidden/shown and thus your custom css styling is lost.
In your case you can bind to igGrid.rowsRendered event and reapply the styling.
Hope this helps,Martin PavlovInfragistics, Inc.
Last time I checked, row template will not work with Hiding feature ? is that not the case anymore ?
Reapply styling in rowsRendered event works.. Thanks !!