Hierarchy Grid

[Leo Ramos]

Hi. 

I want to create a Hierarchy Grid where the first level is a list of products and the second a list of prices for the selected product. All data is stored in the MS SQL Sever and are returned by executing Stored Procedures. 

How do I call a procedure or event to get the price data every time the use expand the product line?

I have both grids working using button to open a new page with the price. I need help to merge them in a hierarchical grid. The code below show the grid working with :

Grid 1 - Products:

<SfGrid @ref="MemberProductGrid"

        DataSource="@memberproduct"  Toolbars"="Toolbaritem >

    <GridFilterSettings Type="Syncfusion.Blazor.Grids.FilterType.Menu"></GridFilterSettings>

<GridEvents RowSelected="RowSelectHandler" OnToolbarClick="ToolbarClickHandler" TValue="MemberProduct"></GridEvents>

...

    <GridColumns>

.....

    </GridColumns>

</SfGrid>

@code {

    private SfGrid<MemberProduct> MemberProductGrid;

    IEnumerable<MemberProduct> memberproduct;

protected override async Task OnInitializedAsync()

    { 

memberproduct = await MemberProductService.MemberProductGetAll(session.MemberID, session.SessionID);

}

public void ToolbarClickHandler(Syncfusion.Blazor.Navigations.ClickEventArgs args)

    { ....

NavigationManager.NavigateTo($"/vendorContractmarkup/{intVendorProductId}");

} 

****** 

public async Task<IEnumerable<MemberProduct>> MemberProductGetAll(int memberid, Guid sessionID)

        {

            IEnumerable<MemberProduct> memberproduct;

...

                memberproduct = await conn.QueryAsync<MemberProduct>("sp_xxxxxxx", parameters, commandType: CommandType.StoredProcedure);

            }

            return memberproduct;

        }

***

Second grid - Price

        <SfGrid @ref="PriceGrid" DataSource="@vendorcontractmarkups"

                AllowResizing="true">

            <GridColumns>

              .....

            </GridColumns>

        </SfGrid>

@code {

    // Create a new, empty Countries object

    private SfGrid<VendorContractMarkups> PriceGrid;

    IEnumerable<VendorContractMarkups> vendorcontractmarkups; 

protected override async Task OnInitializedAsync()

    {

       vendorcontractmarkups = await VendorContractMarkupsService.VendorContractMarkupsList(MemberId, VendorProductId);

   }

**** 

       public async Task<IEnumerable<VendorContractMarkups>> VendorContractMarkupsList(int @MemberId, int @VendorProductId)

        {

            IEnumerable<VendorContractMarkups> vendorcontractmarkups;

....

                vendorcontractmarkups = await conn.QueryAsync<VendorContractMarkups>("sp_yy", parameters, commandType: CommandType.StoredProcedure);

            return vendorcontractmarkups;

        }

[Rahul Narayanasamy]

Hi Leo, 

Greetings from Syncfusion. 

Query: Hierarchy Grid - I want to create a Hierarchy Grid where the first level is a list of products and the second a list of prices for the selected product. 

We have validated your query and you want to create a Hierarchy Grid. We have already documented this topic in our documentation. You can use Query property to send the expanded Id to fetch the corresponding Hierarchy data and bind it to hierarchy Grid while opening the Hierarchy Grid. Find the below links for your reference. 

Reference: 

https://blazor.syncfusion.com/documentation/datagrid/row#rendering-custom-component  

Demo: 

https://blazor.syncfusion.com/demos/datagrid/hierarchy-grid?theme=bootstrap4  

Please let us know if you have any concerns. 

Regards, 

Rahul