Hello Jamil,
I have tested the sample attached and following the steps described I was able to reproduce described behavior.
It is caused by reapplying of the default theme when some grid operation is executed. In this scenario “dataRendered” event is not fired and “applyConditionalRowColor()” function is not executed.
“dataRendered” event is fired on initialization, rebinding, commit, rollback etc.
In order to conditionally style certain grid elements it is recommended to use grid template engine functionality like shown here - http://es.infragistics.com/products/jquery/sample/templating-engine/conditional-row-template
http://help.infragistics.com/NetAdvantage/jQuery/2012.2/CLR4.0?page=Creating_Templates.html
Test this approach and let me know if it suits your scenario.
Hi,
Even in the "conditional Row Template sampe" they are using “dataRendered” event to replace css classes.
Anyway the problem is that I have tried using RowTemplate before making this sample.You may have noticed that I have If-Else statement in applyConditionalRowColor(), as well as I have last boolean column for which I want checkboxes as well. When you use rowTemplate, renderCheckboxes: true generate <span> html instead of checkbox control and I have tried this one as well "<input type='checkbox' {{if BooleanColumn}} checked='checked' {{/if}}></input>" but it's not working as it will be nested if statement because of outer row conditional statement.
Any way this can be resolved by calling applyConditionalRowColor() in rowsRendered event in my given sample.
If you know how to use this with rowTemplate, please change in this sample and upload. As above mentioned problems will occur.
OR
If we know any better way of doing this, please guide me.
Hello Jamil,Indeed the dataRendered event will not be fired since the data is not binded again. But I would suggest you to use the rowsRendered event like:
dataRendered: function () { console.log("dataRendered event"); applyConditionalRowColor(); }, rowsRendered: function(evt, ui) { applyConditionalRowColor(); },
dataRendered: function () { console.log("dataRendered event"); applyConditionalRowColor();
}, rowsRendered: function(evt, ui) { applyConditionalRowColor(); },
Hello Jamil,Please let me know if you have any further questions.