Thanks Dimka

right now i have one another query here I want the parent header to be repetitive for each expanded child. In below example I want dr name row  will be there for Mohite row( above the mohite row)

Thanks again.. :) I just want to know that if we want to change the css style of infragistics grid then is it possible for us to write a new css sheet and apply that for grid.. if yes then please let me know this using example I will be very thankful for your help. I want to change the background color. means need to add two different colors for child and parent.

Hello Mayuri,

In order to create a custom CSS for the grid it is need all existing styles to be overridden.

I have made a research regarding the colors changing questions for the hierarchical grid. The effect you have described could be achieved for non-dynamically applied styles. I have attached a sample representing a possible solution:

        $("#hierarchicalGrid").igHierarchicalGrid({

            rendered: function(evt, ui){

                var tr = $("#hierarchicalGrid").find('[data-id=0]');

                tr.addClass('blue1');

                var i = 0;

                while (tr.length !== 0)

                {

                    i = i + 1;

                    var br = '[data-id='+ i.toString() + ']';

                    var tr = $("#hierarchicalGrid").find(br);

                    tr.addClass('blue1');

                }

            },  …

All parent rows are selected and a custom class is added to them. Feel free to use the sample for custom projects. It could be customized by overriding the .blue1 class.

If you have any further questions or concerns please let me know.

Thanks Dimka!!!

this is very useful for me

Checked your code now I have one another question as I want to  add the different colors for name header and product header is that possible please help me

yes I want the same background color for first child of parent as shown in image but for my grid the number of columns are not fixed as they coming from data base and as the solution given by you previously defines the color with proper name but for that the issue is we have add that much css class for every child cell. Is there any solution that we can get the entire row of child header's of that grid so that's why we are able to add the same css for that row.

and one more thing I want that blue header(parent header ) repetitive for every child with same css.suppose I expand the 3rd row then it should be repetitive for that child also means whatever number of expanded rows there should be same number of repetitive parent header

Hello Mayuri,

In order to change text color in all header cells it is needed to use the style below:

   .ui-iggrid-headertext

    {

        color: yellow !important;

    }

If this does not fit your requirements could please give more details on them? Is it needed to change the text color of just particular child grid headers?

A mockup image would be appreciated to investigate further if needed.

Look forward to hearing from you.

Thank you so much

Please let me know if we are able to change the css of entire header row of name and product . as the example given by you is only applicable for to change the single cell of that header. Thank you once again and waiting for your reply