Forums Ignite UI for jQuery
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Vivek Vardhan
250
Expanding the parent row and highlighting the child row in hierarchical grid
posted

Let me explain the problem.

Take this example: http://www.igniteui.com/hierarchical-grid/load-on-demand 

I want to implement a functionality that takes an array of primarykeys, where each index represents the levels, and after that the corresponding rows will be opened and highlighted.

Explanation:

1) Call function with ['Beverages','Chang'], it should expand the parent row of primary key with value 'Beverages' and highlights the row with primary key value 'Chang'
2) Call function with ['Confections'], it should highlight the row with primary key value 'confections'
3) call function with ['Condiments','Aniseed Syrup','Some Other']: If grid would have been of 3 levels, then the root row with value of primary key as 'Condiments' would have been expanded, inside it row with value of primary key as 'Aniseed Syrup' will be expanded and child row with 'Some Other' as value of key will be highlighted.

Hope I am clear with my requirement.

Is it possible to achieve this in igHieararchical Grid?

Thanks
 

  • 23953
    Offline posted

    Hello Vivek Vardhan,

    I'm glad that you find this information helpful.

    Please let me know if you need further assistance with this matter.

    Best regards,
    Martin Pavlov
    Infragsitics, Inc. 

  • 23953
    Verified Answer
    Offline posted

    Hello Vivek Vardhan,

    Yes, this is possible to achieve with igHierarchicalGrid. Following are some guidelines which will help you achieve your requirement.

    You can select a row from the DOM by its primary key by using its "data-id" attribute. Here is an example:

    var rootRow = $("#gridLoadOnDemand").igHierarchicalGrid("rootWidget").rows().siblings("tr[data-id=1]");

    This code will select a row from the root node of the igHierarchicalGrid with id=1

    To expand a node call the igHierarchicalGrid.expand method.

    To get a child grid use the following code:

    var childGrid = parentRow.next().find("table[data-childgrid='true']").data("igGrid");

    Hope this helps,
    Martin Pavlov
    Infragistics, Inc.