Modal Popup from Repeater


ASP.NET The repeater is data-bound list control that allows custom layout by repeating a specified template for each item displayed in the list. It is more similar to ASP.NET GridView power, but it will enable complete control.
In this post, I will show you how to open a Modal popup from the repeater. The code is straightforward and easy to understand.

<%@ Page Language="C#" AutoEventWireup="true"  
CodeFile="RepeaterModalPopup.aspx.cs"  
 Inherits="RepeaterModalPopup" %>  
  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head runat="server">  
 <title>Untitled Page</title>  
  
 <script type="text/jscript">  
  function ShowModalWindow(Id)  
               {  
window.showModalDialog("Details.aspx?accountNo="+ Id +"","",  
"status:no;dialogWidth:800px;  
dialogHeight:570px;help:no;center:yes;resizable:no;scroll:yes;status:no;");  
               }  
  
 </script>  
  
</head>  
<body>  
 <form id="form1" runat="server">  
     <div>  
         <asp:Repeater ID="Repeater1" runat="server">  
             <HeaderTemplate>  
                 <table border="1" width="100%">  
                     <tr>  
                         <th>  
                             COL1</th>  
                         <th>  
                             COL2</th>  
                         <th>  
                             COL3</th>  
                         <th>  
                             COL4</th>  
                     </tr>  
             </HeaderTemplate>  
             <ItemTemplate>  
                 <tr>  
                     <td>  
                         <a href='Details.aspx?FrromTest=true  
&accountno=<%# DataBinder.Eval(Container.DataItem,"accountNo")  
%>&TypeDesc=<%# DataBinder.Eval(Container.DataItem,"CompanyName") %>'>  
                             <%# DataBinder.Eval(Container.DataItem, "CompanyName")%>  
                         </a>  
                     </td>  
                     <td>  
                         <a href='#'  
onclick="ShowModalWindow('<%# DataBinder.Eval(Container.DataItem,"accountNo") %>');">  
                             <%# DataBinder.Eval(Container.DataItem, "CompanyName")%>  
                         </a>  
                     </td>  
                     <td>  
                         <%# DataBinder.Eval(Container.DataItem,"Address") %>  
                     </td>  
                     <td>  
                         This is a free column</td>  
                 </tr>  
             </ItemTemplate>  
             <FooterTemplate>  
                 </table>  
             </FooterTemplate>  
         </asp:Repeater>  
     </div>  
 </form>  
</body>  
</html>  


using System;  
using System.Data;  
using System.Configuration;  
using System.Collections;  
using System.Web;  
using System.Web.Security;  
using System.Web.UI;  
using System.Web.UI.WebControls;  
using System.Web.UI.WebControls.WebParts;  
using System.Web.UI.HtmlControls;  

public partial class RepeaterModalPopup : System.Web.UI.Page  
{  
 protected void Page_Load(object sender, EventArgs e)  
 {  

     Repeater1.DataSource = GetDataSet();  
     Repeater1.DataBind();  
 }  
 public DataSet GetDataSet()  
 {  
     DataSet ds = new DataSet();  
     DataTable dt = new DataTable("Company");  
     DataRow dr;  
     dt.Columns.Add(new DataColumn("accountNo", typeof(Int32)));  
     dt.Columns.Add(new DataColumn("CompanyName", typeof(string)));  
     dt.Columns.Add(new DataColumn("Address", typeof(string)));  
     for (int i = 0; i <= 10; i++)  
     {  
         dr = dt.NewRow();  
         dr[0] = i;  
         dr[1] = "Company" + i + Environment.NewLine + "Title" + i;  
         dr[2] = "Address" + i + Environment.NewLine + "Title" + i;  
         dt.Rows.Add(dr);  
     }  
     ds.Tables.Add(dt);  
     return ds;  
 }  
}  

Details.aspx

public partial class Details : System.Web.UI.Page  
{  
 protected void Page_Load(object sender, EventArgs e)  
 {  
     
     DataView dv = new DataView(GetDataSet().Tables[0]);  
     dv.RowFilter = "accountno='" + Request.QueryString["accountno"].ToString() + "'";  
     GridView1.DataSource = dv;  
     GridView1.DataBind();  

 }  
}

Please do not post any spam link in the comment box😊

Post a Comment (0)
Previous Post Next Post