This is a migrated thread and some comments may be shown as answers.

Master-Detail RadGridView Implementation

5 Answers 368 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Brajendra
Top achievements
Rank 1
Brajendra asked on 08 Aug 2017, 12:54 PM

Hi,

 

I'm unable to mimic Master - Detail data display using RadGridView control. Let me know where I'm going wrong.

Following is my code:

private void BindGrid()
        {
            try
            {
                DataTable dtDept = new DataTable();
                DataColumn dcDptID = new DataColumn("DeptID");
                DataColumn dcDName = new DataColumn("DeptName");
                dtDept.Columns.Add(dcDptID);
                dtDept.Columns.Add(dcDName);

                DataRow drDPT = dtDept.NewRow();
                drDPT["DeptID"] = "10";
                drDPT["DeptName"] = "Admin";
                dtDept.Rows.Add(drDPT);

                drDPT = dtDept.NewRow();
                drDPT["DeptID"] = "11";
                drDPT["DeptName"] = "Finance";
                dtDept.Rows.Add(drDPT);
                
                DataTable dtEmp = new DataTable();
                DataColumn dcID = new DataColumn("EmpID");
                DataColumn dcName = new DataColumn("EmpName");
                DataColumn dcDeptID = new DataColumn("DeptID");
                dtEmp.Columns.Add(dcID);
                dtEmp.Columns.Add(dcName);
                dtEmp.Columns.Add(dcDeptID);

                DataRow dRow = dtEmp.NewRow();
                dRow["EmpID"] = "1001";
                dRow["EmpName"] = "Raaz";
                dRow["DeptID"] = "10";
                dtEmp.Rows.Add(dRow);

                dRow = dtEmp.NewRow();
                dRow["EmpID"] = "1002";
                dRow["EmpName"] = "Amit";
                dRow["DeptID"] = "11";
                dtEmp.Rows.Add(dRow);

                rdGridDemo.MasterTemplate.DataSource = dtDept ;

                GridViewTemplate gvChildTemplate = new GridViewTemplate();
                gvChildTemplate.AutoGenerateColumns = false;
                gvChildTemplate.AutoSizeColumnsMode = GridViewAutoSizeColumnsMode.Fill;
                gvChildTemplate.AllowAddNewRow = false;
                gvChildTemplate.EnableCustomGrouping = false;
                gvChildTemplate.EnableGrouping = false;
                gvChildTemplate.ShowGroupedColumns = false;

                GridViewTextBoxColumn colEmpID = new GridViewTextBoxColumn();
                colEmpID.Name = "colEmpID";
                colEmpID.HeaderText = "Employee ID";
                colEmpID.FieldName = "EmpID";
                gvChildTemplate.Columns.Add(colEmpID);

                GridViewTextBoxColumn colEmpName = new GridViewTextBoxColumn();
                colEmpName.HeaderText = "Employee Name";
                colEmpName.FieldName = "EmpName";
                gvChildTemplate.Columns.Add(colEmpName);

                GridViewTextBoxColumn colDeptID = new GridViewTextBoxColumn();
                colDeptID.HeaderText = "Dept ID";
                colDeptID.FieldName = "Dept ID";
                gvChildTemplate.Columns.Add(colDeptID);

                gvChildTemplate.DataSource = dtEmp;

                rdGridDemo.Templates.Clear();
                rdGridDemo.Relations.Clear();
                rdGridDemo.MasterTemplate.Templates.Add(gvChildTemplate);
                
                GridViewRelation relation = new GridViewRelation(rdGridDemo.MasterTemplate);
                relation.ChildTemplate = gvChildTemplate;
                relation.RelationName = "EmpDeptRelation";
                relation.ParentColumnNames.Add("DeptID");
                relation.ChildColumnNames.Add("DeptID");
                rdGridDemo.Relations.Add(relation);
                
            }
            catch (Exception Ex)
            {
                lblMsg.Text = Ex.Message;
            }
        }

 

/* Thanks */

 

5 Answers, 1 is accepted

Sort by
0
Dess | Tech Support Engineer, Principal
Telerik team
answered on 09 Aug 2017, 06:49 AM
Hello Brajendra, 

Thank you for writing.  

It seems that the FieldName property of the "Dept ID" column is wrong. Please refer to the attached screenshot. There is no space between the two words in the DataTable's column. If you change it to "DeptID" the hierarchy is setup correctly and the child rows are shown when expanding the parent rows. 

Additional information about grid hierarchy is available in the following code snippet: http://docs.telerik.com/devtools/winforms/gridview/hierarchical-grid/binding-to-hierarchical-data-programmatically

I hope this information helps. Should you have further questions I would be glad to help.

Regards,
Dess
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Brajendra
Top achievements
Rank 1
answered on 09 Aug 2017, 10:56 AM

Hi,

Thanks for the answer, yes I realized it and corrected it. Though the real issue I'm facing is I'm creating two fields / columns at design time (Department ID and Department Name), I'm specifying the FieldName property with DeptID & DeptName respectively.

Then my following code is not working.

private void BindGrid()
        {
            try
            {
                DataTable dtDept = new DataTable();
                DataColumn dcDptID = new DataColumn("DeptID");
                DataColumn dcDName = new DataColumn("DeptName");
                dtDept.Columns.Add(dcDptID);
                dtDept.Columns.Add(dcDName);

                DataRow drDPT = dtDept.NewRow();
                drDPT["DeptID"] = "10";
                drDPT["DeptName"] = "Admin";
                dtDept.Rows.Add(drDPT);

                drDPT = dtDept.NewRow();
                drDPT["DeptID"] = "11";
                drDPT["DeptName"] = "Finance";
                dtDept.Rows.Add(drDPT);

                DataTable dtEmp = new DataTable();
                DataColumn dcID = new DataColumn("EmpID");
                DataColumn dcName = new DataColumn("EmpName");
                DataColumn dcDeptID = new DataColumn("DeptID");
                dtEmp.Columns.Add(dcID);
                dtEmp.Columns.Add(dcName);
                dtEmp.Columns.Add(dcDeptID);

                DataRow dRow1 = dtEmp.NewRow();
                dRow1["EmpID"] = "1001";
                dRow1["EmpName"] = "Raaz";
                dRow1["DeptID"] = "10";
                dtEmp.Rows.Add(dRow1);

                DataRow dRow2 = dtEmp.NewRow();
                dRow2["EmpID"] = "1002";
                dRow2["EmpName"] = "Amit";
                dRow2["DeptID"] = "11";
                dtEmp.Rows.Add(dRow2);
                
                GridViewTemplate gvChildTemplate = new GridViewTemplate();
                gvChildTemplate.AutoGenerateColumns = false;
                gvChildTemplate.AutoSizeColumnsMode = GridViewAutoSizeColumnsMode.Fill;
                gvChildTemplate.AllowAddNewRow = false;
                gvChildTemplate.EnableCustomGrouping = false;
                gvChildTemplate.EnableGrouping = false;
                gvChildTemplate.ShowGroupedColumns = false;

                GridViewTextBoxColumn colEmpID = new GridViewTextBoxColumn();
                colEmpID.Name = "colEmpID";
                colEmpID.HeaderText = "Employee ID";
                colEmpID.FieldName = "EmpID";
                gvChildTemplate.Columns.Add(colEmpID);

                GridViewTextBoxColumn colEmpName = new GridViewTextBoxColumn();
                colEmpName.HeaderText = "Employee Name";
                colEmpName.FieldName = "EmpName";
                gvChildTemplate.Columns.Add(colEmpName);

                GridViewTextBoxColumn colEmpDeptID = new GridViewTextBoxColumn();
                colEmpDeptID.HeaderText = "Dept ID";
                colEmpDeptID.FieldName = "DeptID";
                gvChildTemplate.Columns.Add(colEmpDeptID);

                rdGridDemo.DataSource = null;
                gvChildTemplate.DataSource = null;
                rdGridDemo.Relations.Clear();

                rdGridDemo.DataSource = dtDept;
                gvChildTemplate.DataSource = dtEmp;

                rdGridDemo.Templates.Clear();
                rdGridDemo.Relations.Clear();
                rdGridDemo.Templates.Add(gvChildTemplate);

                GridViewRelation relation = new GridViewRelation(rdGridDemo.MasterTemplate);
                relation.ChildTemplate = gvChildTemplate;
                relation.RelationName = "EmpDeptRelation";
                relation.ParentColumnNames.Add("DeptID");
                relation.ChildColumnNames.Add("DeptID");
                rdGridDemo.Relations.Add(relation);

            }
            catch (Exception Ex)
            {
                lblMsg.Text = Ex.Message;
            }
        }

        private void GridForm2_Load(object sender, EventArgs e)
        {
            BindGrid();
        }

 

The Example is working fine when no columns are being added at design team. I think it should work when grid's master template is added with columns at design time.

 

Thanks & Regards

Braj

0
Dess | Tech Support Engineer, Principal
Telerik team
answered on 10 Aug 2017, 07:59 AM
Hello Brajendra, 

Thank you for writing back. 

When you add the columns for the MasterTemplate at design time, along with the column's FieldName property it is necessary to set the column's Name property to the FieldName value. Thus, the defined relation will extract the required value for the hierarchy. I have attached the modified sample project.

I hope this information helps. If you have any additional questions, please let me know. 

Regards,
Dess
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Brajendra
Top achievements
Rank 1
answered on 16 Aug 2017, 05:56 AM

Hi Dess,

Thanks a lot for the reply, I figured this out and the stuff I was working on is achieved.

My suggestion : "Please have this thing in documentation (available online)" It would save a lot of time for a beginner on telerik controls. I happened to accidently put the column name to the field name and it worked for me.

 

Thanks & Regards

Braj

0
Dess | Tech Support Engineer, Principal
Telerik team
answered on 16 Aug 2017, 10:26 AM
Hello Brajendra, 

Thank you for writing back. 

I am glad that the problem you were facing is now resolved. We will update the documentation accordingly in order to avoid any further confusion.

If you have any additional questions, please let me know. 

Regards,
Dess
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
GridView
Asked by
Brajendra
Top achievements
Rank 1
Answers by
Dess | Tech Support Engineer, Principal
Telerik team
Brajendra
Top achievements
Rank 1
Share this question
or