This is different than what I'm looking. I'm looking for how to give custom header text for igHierarchicalGrid . Can you please modify the attached example ?

-Manish

Hi Manish,

I am looking at this further and will follow-up with you here on the thread.

Hi Manish,

So, looking at your request here as it relates to the recommended approach per the thread suggested, I am not quite clear as to why you are finding it to be different than what you are looking for. Can you offer some further details? The thread that I point to discusses how to change the column header text after load. So this would apply to changing the column header text (or custom header text) when reloading the grid as you are.

Let me know the differences as this may help to clarify for me, and I can proceed forward based on your clarification.

Thanks Manish!

Hi Manish,

A you have observed, the child grid DOM is not created until the point when the parent grid row is expanded for the first time. Given this, what you want to do is to wait and handle changing of the grid headers at such a point as the parent row is expanded.

Then to get access to the child grid, you need to call the "allChildrenWidgets" method.

To accomplish your objective I moved the changing of the child grid headers out of the ReLoadedData() and do this operation when listening for the childGridCreated event:

$("#hierarchicalGrid").on("igchildgridcreated", function (evt, ui) {                

ui.element.data("igGrid").headersTable().find("thead").find('span.ui-iggrid-headertext').html();          

var text2 = $("#hierarchicalGrid").igHierarchicalGrid("allChildrenWidgets")[0].headersTable().find("thead").find('span.ui-iggrid-headertext').html();     

if(text2 =='SerialNumber'){      

$("#hierarchicalGrid").igHierarchicalGrid("allChildrenWidgets")[0].headersTable().find("thead").find('span.ui-iggrid-headertext').html("CustomSerialNumber");      

}             

})

Attached is the revised sample for your reference.

Let me know if you need any additional assistance regarding this objective.

Hi Manish,

I am looking further into this matter for you. I will follow-up with you here on the thread once I have some further details.

My approach is there in the sample I attached. I used this

if(text =='SerialNumber'){
    $("#hierarchicalGrid").igGrid("headersTable").find('thead').find('span.ui-iggrid-headertext').html('CustomSerialNumber')
    }

But my question is how to set custom text for child columns without expanding it.

Thanks!

Manish

I have modified my initial post example and attached new one with this post. I have custom text header for top level column but I want child columns also with custom text.

-Manish

Hi Manish,

I will ask that you provide me an example I can run along with steps-to-reproduce that shows this issue occurring. With that I can look further into what is happening here. Thank you!