Hierarchical - Parent and Child Select

Thread ID:

Created:

Updated:

Platform:

Replies:

Not sure whether Grid is the right control or if there is any other syncfusion control that can be used for my requirement. The requirement is that I have 2 tables with Parent : Child relationship. For example let's say we have Department and Employee tables where each employ belongs to a department.

If we want to store information regarding department and employee participation in project (couple of relationships here Project : Department and Project : Employee). I was thinking I could use something like Hierarchical solution to display Departments where users can select it by clicking on the check box or something on grid row, so relationship between Project and Department is updated/stored. And once that's done Employees within the selected department can be chosen (via check box on grid row) in the child grid. Perhaps this can be done on Master-Details or TreeGrid or TreeView controls too?

Hi Prasanth,
Thanks for contacting Syncfusion support.
Hierarchy Grid feature is used to render the Grid inside the grid row. To view the child grid, we use the expand button in each row of the parent grid. The child grid data has been bound based on the foreign key field to querystring property.
Please find the code example, screenshot and sample:

1.Do you need to render the checkbox in the child grid?Query : “And once that's done Employees within the selected department can be chosen (via check box on grid row) in the child grid?”
Could you please elaborate the above query?, it will help us to provide the prompt solution.
Query: Perhaps this can be done on Master-Details or TreeGrid or TreeView controls too?Treeview control will be well suited for your requirement as TreeGrid control is designed to load values across multiple columns.
Regards,
Jayaprakash K

Wishing you a Happy New Year and thanks for the reply & source code. Appreciated and sorry for not explaining properly earlier. Below is the sample data structure and query regarding my requirement.

Primary Tables

Employee

ID

Name

DepartmentID

Department

ID

Name

Project

ID

Name

Relationship Tables

ProjectDepartment

ID

ProjectID

DepartmentID

Active

ProjectEmployee

ID

ProjectID

EmployeeID

Active

Basically for each project I want to be able to display
Departments in the main grid while showing employees within the sub grid. Now this is doable with the primary tables
(employee and department) using hierarchical grid as per the example on the
syncfusion website. However I want to
incorporate the data stored in the relationship tables as well in the grids
(i.e. showing a checkbox to indicate whether each department is associated with
the project as well as each employee within the department is associated with
the project). By unchecking the check box just simply set the Active columns to false.

Thanks for your New Year wishes and please accept the same from us. We have analyzed your question and identified the following requirements. Would you review this and let us know if we have missed anything?

1.Do you want to display the relationship tables in the hierarchical grid and the project Department is to be in the main grid?

2.If the checkbox is checked in the parent grid, you want to display the child grid. The checkbox indicates the relationship between the two tables.

1. Do you want to display the relationship tables in the hierarchical grid and the project Department is to be in the main grid?

I think I might have not explained it well in the previous post. I will try to explain further belwo

2. If the checkbox is checked in the parent grid, you want to display the child grid. The checkbox indicates the relationship between the two tables. Yes

3. Do you want the checkbox in the child grid? YES

4. Do you need to uncheck the checkbox in editing state? YES

5. Can you please elaborate the checkbox function that you require?

View Models

Departmental Project

ID

Project Name

Department Name

Active

Employees in Project

Department Name

Project Name

Employee Name

Active

Let’s say we visit a project’s page which displays the information regarding the department’s involved in it and also provides ability to add / remove departments association with the project.

Also I want to be able to attach employees to the project (but employees belong to department so it will be nice to group them – hierarchical grid under departments)

So the envisaged hierarchical grid design is as per below table. Basically check box is meant to be in the last column for both parent (Department involved with the Project) and child (Employ working on Project) to indicate whether the entity (employee or department) is currently involved/working on the project.

Department

Department
involved with the Project

Sales

Yes

Employee

Employ working
on Project

Krishna

No

Rama

Yes

Research Development

Employee

Employ working
on Project

David

No

Initially I thought I could list the entire department in the system on top level of the hierarchical grid while displaying the employees within the department under each department.

So the check box is merely maps to a boolean (Active) field on the corresponding entity relationship (department or employee) view model

Hope this helps explaining things better, apologies for not explaining on previous post

Thanks for providing additional information.Your requirement has been achieved using rowDataBound and detailExpand events of ejGrid. rowDataBound event triggers every time a request is made to access particular row information and we can get the row details in the arguments. Using that, we check the condition with column value and hide the expand button by adding the class name.

In detailExpand, event we can get the data in the arguments. Using we check the condition with Active and hide the details row element.