Hi Varun,
You can find all the LinkButtons and attach a javascript function with parameters on server side (For example, Page_Load). Here is the whole sample.
<%@. Page Language="C#" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script runat="server"> protected void Page_Load(object sender, EventArgs e) { //Attach a Javascript funtion to the LinkButton. LinkButton myLinkButton; for (int i = 0; i < GridView1.Rows.Count; i++) { myLinkButton = (LinkButton)GridView1.Rows[i].Cells[4].FindControl("LinkButton1"); myLinkButton.Attributes.Add("onclick", "shopModalPopup('" + GridView1.Rows[i].Cells[0].Text + "');return false;"); } } </script><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Untitled Page</title> <style> .modalBackground { background-color:Gray; filter:alpha(opacity=70); opacity:0.7; } .modalPopup { background-color:#FFD9D5; border-width:3px; border-style:solid; border-color:Gray; padding:3px; width:250px; } </style></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="EmployeeID" DataSourceID="SqlDataSource1"> <Columns> <asp:BoundField DataField="EmployeeID" HeaderText="EmployeeID" InsertVisible="False" ReadOnly="True" SortExpression="EmployeeID" ItemStyle-Width="0" /> <asp:BoundField DataField="LastName" HeaderText="LastName" SortExpression="LastName" /> <asp:BoundField DataField="FirstName" HeaderText="FirstName" SortExpression="FirstName" /> <asp:BoundField DataField="Title" HeaderText="Title" SortExpression="Title" /> <asp:TemplateField> <ItemTemplate> <asp:LinkButton ID="LinkButton1" runat="server">Click On Me</asp:LinkButton> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView> <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NORTHWNDConnectionString%>" SelectCommand="SELECT [EmployeeID], [LastName], [FirstName], [Title] FROM [Employees]"> </asp:SqlDataSource> <asp:Panel ID="Panel1" runat="server" CssClass="modalPopup" Height="200px" Width="300px" style="display:none"> <asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> EmployeeID:<asp:TextBox ID="tbEmployeeID" runat="server"></asp:TextBox> <br/> Reason:<asp:TextBox ID="tbReason" runat="server"></asp:TextBox> </ContentTemplate> </asp:UpdatePanel> <asp:Button ID="btnCancel" runat="server" Text="Cancel" /> </asp:Panel> <div style="display: none"> <asp:Button ID="Button1" runat="server" Text="Button" /></div> <ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="Button1" PopupControlID="Panel1" CancelControlID="btnCancel" BackgroundCssClass="modalBackground"> </ajaxToolkit:ModalPopupExtender> <script type="text/javascript" language="javascript">function shopModalPopup(employeeID){ //show the ModalPopupExtender $get("<%=tbEmployeeID.ClientID%>").value = employeeID; $get("<%=tbReason.ClientID%>").value =""; $find("<%=ModalPopupExtender1.ClientID%>").show(); } </script> </form></body></html>I hope this help.
Best regards,
Jonathan
No comments:
Post a Comment