Master Slave (child) controls in Grid Views to display data.

1. Master –Slave in GridView
Let ussee howto create a master-slave gridviewsinVisual WebDeveloper.
Imagine,yourbackendtablescontainthe followingdata:
Table 1:
Employee_CD Employee_Name
10001 DharmarajuBK
10002 SanjanaD
10003 Kiran
10004 Muni
10005 Narayana
10006 ABC
10007 xyz
10008 tttt
Table 2:
Employee_CD Date_of_Contribution Amount
10003 10-02-2021 1000
10003 01-03-2021 500
10003 01-04-2021 5000
10001 10-02-2021 5000
10001 01-04-2021 3000
10001 01-05-2021 1500
10001 01-08-2021 500
10001 01-05-2021 500
10002 01-01-2021 10000
Now,letussee howto displaythe above intwo GridViewsinMaster-Slave relationshipasshown
belowFig1andFig2:
Fig – 1

2. Fig - 2
1. Drag and Drop a GridViewintothe webpage.
2. Attach Back-enddatabase table whichyouwantto treat as Master Table.
3. Clickon the Gridview.Inthe Propertieswindow,find Parameterbyname – “Data Key
Names”.Clickonthisrow. You will see the listof columnsinthe back-endtable appears ina
pop-upwindow. Clickonthe KeyField/column name andpresson > mark. ThenpressOK
button. See the belowpictures.

3. 4. From the GridViewTasks,choose ‘EnableSelection’Option.See below picture
5. You can alsochoose BackgroundColourfor a SelectedRow of thisGridview. Clickonthe
Gridview.FromGridViewproperties,choose SelectedRowStyle BackColoroption.Choose
a colour fromthe ColourPallette
The above stepssetsup the GridViewforthe MasterTable.
Setting Up of GridView for the Slave or Item or Child Data
Now,adda secondGridView todisplay Slave orItemorChildData. Place thissecondGridViewjust
belowthe firstone. Setitspositionto‘Relative’ byusingbelow steps:
1. Drag and Drop secondGridViewintothe webpage. Setsitspositionas‘Relative’byselecting
optionsFormat  SetPosition  Relative.Positionitjustbelow the firstGridView.
Relative position will helpyoutoplace the secondGridview justbelow the firstGridview.
Also,if the firstGridViewgrowswithmore rows(records),itautomaticallypushesthe
secondGridviewdown,avoidingoverlappingof twoGridViews.

4. 2. You needtoattach slave / childtable fromback-enddatabase.Inthe Configure Data Source
screen,selectsuitable back-endtable. Selectcolumnsyouwanttodisplay.Afterthis,clickon
Where Button (See the belowFigure)
3. In the column,choose Key field(ie.The columnwhichiscommonbetweentwotables –
Master and Slave);SetOperatorValue to=; SelectSource = Control;Control ID= Gridview1.
You can see where clause expressionappearsautomaticallyinthe ‘Where Clause’ window
(See the belowFigure). PressOKButton.

5. 4. ClickNext FinishButtons
5. Run thispage ina Browser.Clickon‘SELECT’ Linkinthe FirstGridview togetthe displayof
relatedrow(s) inthe SecondGridView. If there are nomatchingrowsavailable inthe
Child/Slave table forthe selectedvalue,thentherewillbe nodisplay inthe second
GridView.