Hi all,
try this example to Create Gridview Lockup
in this example i’m using Northwind Database
1) Open VS 2005 and create a new WebSite and add new Page called “Default.aspx” and from ToolBox add Gridview Control and Bind it to Categories Table using SqlDataSource control so our page will be like this
<div>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="CategoryID"
DataSourceID="SqlDataSource1" OnRowDataBound="GridView1_RowDataBound" CellPadding="4" ForeColor="#333333">
<Columns>
<asp:TemplateField HeaderText="CategoryName" SortExpression="CategoryName">
<ItemTemplate>
<asp:TextBox ID="txt_Category" runat="server" Text='<%# Bind("CategoryName") %>' ></asp:TextBox>
<asp:LinkButton ID="LinkButton1" runat="server">list</asp:LinkButton><br />
<asp:HiddenField ID="HiddenField1" runat="server" Value='<%# Eval("CategoryID") %>' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
<RowStyle BackColor="#EFF3FB" />
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
<SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
<HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<EditRowStyle BackColor="#2461BF" />
<AlternatingRowStyle BackColor="White" />
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
SelectCommand="SELECT [CategoryID], [CategoryName] FROM [Categories]"></asp:SqlDataSource>
</div>
2) Now We want when user Click on HyperLink inside Gridview open popup window which has a Gridview Bindable to all Categories from Northwind database and when user select any Category from that Gridview pass CategoryName and CategoryID to the Gridview in Parent page which is “Default.aspx” so now we are going to add some Jaavscript code in Default page to Open Popup page so the javascipt code will be :
<script type="text/javascript">
function OpenPopup(txtField, hdnField) {
window.open("popup.aspx?TxtField=" + txtField + "&HdnField=" + hdnField,
"List", "scrollbars=no,resizable=no,width=400,height=280");
return false;
}
</script>
as we see the popup page will be popup.aspx so we have to create a new web page and call it “popup.aspx”
3) In code behind of Default.aspx we need to write some code to open that popup window and pass the ID of TextBox (which contain CategoryName) and ID of hiddenField (which is bindable to CategoryID) so in RowDataBound Event of Gridview we will add this code
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
TextBox txt_Category = (TextBox)e.Row.FindControl("txt_Category");
HiddenField HiddenField1 = (HiddenField)e.Row.FindControl("HiddenField1");
LinkButton LinkButton1 = (LinkButton)e.Row.FindControl("LinkButton1");
if (txt_Category != null && HiddenField1 != null && LinkButton1 != null)
{
LinkButton1.Attributes.Add("onclick", "javascript:OpenPopup('" + txt_Category.ClientID + "','" + HiddenField1.ClientID + "');return false;");
}
}
}
4) In popup.aspx page we will add Gridview Control and Bind it to Categories Table using SqlDataSource control and two hiddenField control which we will save ID of TextBox and HiddenField from the parent page so our page will be like this :-
<div>
<asp:HiddenField ID="HTextControlName" runat="server" />
<asp:HiddenField ID="HHiddenControlname" runat="server" />
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="CategoryID"
DataSourceID="SqlDataSource1" CellPadding="4" ForeColor="#333333" OnRowDataBound="GridView1_RowDataBound">
<Columns>
<asp:BoundField DataField="CategoryID" HeaderText="CategoryID" InsertVisible="False"
ReadOnly="True" SortExpression="CategoryID" />
<asp:BoundField DataField="CategoryName" HeaderText="CategoryName" SortExpression="CategoryName" />
<asp:TemplateField>
<ItemTemplate>
<asp:LinkButton ID="LinkButton1" runat="server">Select</asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<RowStyle BackColor="#EFF3FB" />
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
<SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
<HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<EditRowStyle BackColor="#2461BF" />
<AlternatingRowStyle BackColor="White" />
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
SelectCommand="SELECT [CategoryID], [CategoryName] FROM [Categories]"></asp:SqlDataSource>
</div>
no we want when user Click On Select Link in Gridview to pass the Value of CategoryName and CategoryID from Child window to Parent Page so in popup.aspx we will add this Javascript Code
<script language="javascript" type="text/javascript">
function GetRowValue(val, id, txtField, hdnField)
{
window.opener.document.getElementById(txtField).value = val;
window.opener.document.getElementById(hdnField).value = id;
window.close();
}
</script>
and In Code behind :-
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
if (Request.QueryString["TxtField"] != null &&
Request.QueryString["HdnField"] != null)
{
HTextControlName.Value = Request.QueryString["TxtField"];
HHiddenControlname.Value = Request.QueryString["HdnField"];
}
}
}
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if ((e.Row.RowType == DataControlRowType.DataRow))
{
((LinkButton)e.Row.FindControl("LinkButton1")).Attributes.Add("onclick", "javascript:GetRowValue('"
+ e.Row.Cells[1].Text + "','" + e.Row.Cells[0].Text + "','" + HTextControlName.Value
+ "','" + HHiddenControlname.Value + "')");
}
}
now run the website and from Gridview in Default.aspx click on List link you will find a popup window open and from that popup click on select link in Gridview you will find the Gridview in Default.aspx has the new value which is selected from popup window
Hope this helps
Good Luck