Open Ajax Modal Popup Extender in ListView ItemCommand in ASP.NET |Brijesh Solutions

.aspx Page Content:

Header Section:

<style type="text/css">
.btn-sign
{
width: 200px;
margin-bottom: 10px;
margin: 0 auto;
padding: 10px;
border-radius: 5px;
background: -moz-linear-gradient(center top, #00c6ff, #018eb6);
background: -webkit-gradient(linear, left top, left bottom, from(#00c6ff), to(#018eb6));
background: -o-linear-gradient(top, #00c6ff, #018eb6);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#00c6ff', EndColorStr='#018eb6');
text-align: center;
font-size: 20px;
color: #fff;
text-transform: uppercase;
}
.textbox
{
width: 230px;
margin: 15px auto;
height: 240px;
padding-top: 25px;
border: 1px solid Silver;
border-radius: 5px 5px 5px 5px;
background-color: rgb(236, 246, 217);
box-shadow: 0px 0px 3px 2px rgb(211, 230, 175);
}
.btn-sign a
{
color: #fff;
text-shadow: 0 1px 2px #161616;
}
#mask
{
display: none;
background: #000;
position: fixed;
left: 0;
top: 0;
z-index: 10;
width: 100%;
height: 100%;
opacity: 0.8;
z-index: 999;
}
.login-popup
{
display: block;
background: #333;
padding: 10px;
border: 2px solid #DA9F49;
font-size: 1.2em;
width: 310px;
position: fixed;
height: 340px;
top: 15%;
left: 35%; /*z-index: 99999;*/
box-shadow: 0px 0px 20px #999;
-moz-box-shadow: 0px 0px 20px #999; /* Firefox */
-webkit-box-shadow: 0px 0px 20px #999; /* Safari, Chrome */
border-radius: 7px;
-moz-border-radius: 7px; /* Firefox */
-webkit-border-radius: 10px; /* Safari, Chrome */
}
.textbox label, .textboxnew label
{
display: block;
padding-bottom: 7px;
font-size: 11px;
}
form.signin p, form.signin span
{
color: #999;
font-size: 11px;
}
.textbox input, .textboxnew input
{
background: #666666;
border-bottom: 1px solid #333;
border-left: 1px solid #000;
border-right: 1px solid #333;
border-top: 1px solid #000;
color: #fff;
border-radius: 3px 3px 3px 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
font: 13px Arial, Helvetica, sans-serif;
padding: 6px 6px 4px;
width: 200px;
}
form.signin input:-moz-placeholder
{
color: #bbb;
text-shadow: 0 0 2px #000;
}
form.signin input::-webkit-input-placeholder
{
color: #bbb;
text-shadow: 0 0 2px #000;
}
.button
{
background: -moz-linear-gradient(center top, #f3f3f3, #dddddd);
background: -webkit-gradient(linear, left top, left bottom, from(#f3f3f3), to(#dddddd));
background: -o-linear-gradient(top, #f3f3f3, #dddddd);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f3f3f3', EndColorStr='#dddddd');
border-color: #000;
border-width: 1px;
border-radius: 4px 4px 4px 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
color: #333;
cursor: pointer;
display: inline-block;
padding: 6px 6px 4px;
margin-top: 10px;
font: 12px;
width: 214px;
}
.button:hover
{
background: #ddd;
}
.BackgroundStyle
{
background-color: #f3f3f3;
filter: alpha(opacity=50);
opacity: 0.5;
}
</style>

Body Section:

<ajt:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"
CombineScripts="True">

</ajt:ToolkitScriptManager>
<asp:Label ID="lblmsg" runat="server" Text="" ForeColor="Red" Font-Bold="true" Font-Size="15px"></asp:Label>
<asp:ListView ID="ListView1" runat="server" GroupItemCount="2" GroupPlaceholderID="groupPlaceHolder1"
ItemPlaceholderID="itemPlaceHolder1" onitemcommand="ListView1_ItemCommand">
<LayoutTemplate>
<table>
<asp:PlaceHolder runat="server" ID="groupPlaceHolder1"></asp:PlaceHolder>
</table>
</LayoutTemplate>
<GroupTemplate>
<tr>
<asp:PlaceHolder runat="server" ID="itemPlaceHolder1"></asp:PlaceHolder>
</tr>
</GroupTemplate>
<ItemTemplate>
<td>
<table cellpadding="0" cellspacing="0"
style="width:450px; background-color: #FFFFFF; font-family:Calibri;
border-radius: 5px; border: solid 1px #dddddd; font-size: 9pt; color: #666666">
<tr>
<td align="left" height="20px" bgcolor="#8ebe12" style="padding-left: 7px; color: #ffffff" colspan="2">
<b>Roll No: </b>
<asp:Label ID="lblid" runat="server" Text='<%# Eval("Row_Id")%>' Visible="false"></asp:Label>
<%# Eval("RollNo")%>
</td>
</tr>
<tr>
<td height="2px" colspan="2">
</td>
</tr>
<tr>
<td style="width:25%" align="left" valign="top">
<asp:Image ID="Image2" runat="server" Height="96px" Width="96px"
style="border:Solid 2px #8ebe12; border-radius:5px"
ImageUrl='<%#"../RegStudent/"+Eval("Photo")%>' />
</td>
<td style="width:75%" valign="top">
<table style="width:100%; text-align:left">
<tr>
<td style="width:30%"><span style="color: Maroon"><b>Name: </b></span></td>
<td>:</td>
<td style="width:69%">
<asp:Label ID="lblname" runat="server" Text='<%# Eval("Name")%>'></asp:Label></td>
</tr>
<tr>
<td><span style="color: Maroon"><b>Class: </b></span></td>
<td>:</td>
<td>
<%# Eval("Quali1")%> ( <%# Eval("Quali2")%> )</td>
</tr>
<tr>
<td><span style="color: Maroon"><b>Father's Name: </b></span></td>
<td>:</td>
<td>
<%# Eval("FName")%></td>
</tr>
<tr>
<td><span style="color: Maroon"><b>Mobile: </b></span></td>
<td>:</td>
<td>
<%# Eval("Mob1")%></td>
</tr>
<tr>
<td></td>
<td></td>
<td align="right">
<asp:ImageButton ID="btnDetails" runat="server" ImageUrl="Admin/Image/explore.jpg"
ToolTip="Details" CommandName="Details"/>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</ItemTemplate>
</asp:ListView>
<asp:Button ID="Button1" runat="server" Text="Button" style="display:none" />
<ajt:ModalPopupExtender ID="mdlpopup1" runat="server" TargetControlID="Button1" PopupControlID="pnllogin1"
DropShadow="true" BackgroundCssClass="BackgroundStyle" CancelControlID="ibtnclose1">
</ajt:ModalPopupExtender>
<asp:Panel ID="pnllogin1" runat="server" style="display:none; font-family:Calibri" DefaultButton="Button2">
<div id="login-box" class="login-popup" style="height:360px">
<div style="margin-top:-26px; margin-right:-24px; text-align:right"><asp:ImageButton ID="ibtnclose1" runat="server" ImageUrl="~/img/close_pop.png"/></div>
<div style="color:#89BD24; font-weight:bold; font-family:Calibri; font-size:18px; text-align:center;
margin-top:-10px; margin-bottom:10px">Student SignIn</div>
<fieldset class="textbox" style="height:260px; text-align:left">
<asp:Label ID="lblname" runat="server" Text="" ForeColor="Red" Font-Size="11px"></asp:Label>
<label>
<span>Email Id</span>
<input id="txtemail" name="Email Id" runat="server" value="" type="text"
placeholder="Email Id"/>
<asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ControlToValidate="txtemail"
SetFocusOnError="true" Display="None" ValidationGroup="reguser" ErrorMessage="Plesse enter your email id" />
<ajt:ValidatorCalloutExtender ID="ValidatorCalloutExtender7" TargetControlID="RequiredFieldValidator5"
runat="server" />
<asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server" ControlToValidate="txtemail"
ValidationExpression="^([a-zA-Z0-9_\-\.]+)@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$"
Display="None" ErrorMessage="Please enter valid EmailID" ValidationGroup="reguser"
SetFocusOnError="True" />
<ajt:ValidatorCalloutExtender ID="ValidatorCalloutExtender8" runat="server" Enabled="True"
TargetControlID="RegularExpressionValidator2" />
</label>
<label>
<span>Password</span>

<input id="txtpass" runat="server" name="password" value="" type="password" placeholder="Password"/>
<asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ControlToValidate="txtpass"
SetFocusOnError="true" ValidationGroup="reguser" Display="None" ErrorMessage="Please enter password" />
<ajt:ValidatorCalloutExtender ID="ValidatorCalloutExtender9" runat="server" TargetControlID="RequiredFieldValidator6" />
</label>
<br />
<asp:Label ID="lblerror" runat="server" Text="" ForeColor="Red" Font-Size="11px"></asp:Label>
<asp:Button ID="Button2" class="submit button" runat="server" Text="Sign in"
BackColor="#669900" ForeColor="White" Font-Names="calibri"
Font-Size="14pt" Font-Bold="True" ValidationGroup="reguser"
onclick="Button2_Click"/>
<br /><br />
<a href="#" style="color: red; font-size:11px">
Forgot your password?</a>
</fieldset>
</div>

</asp:Panel>

.cs Page Content:

Datautility app = new Datautility();
DataSet ds;
protected void Page_Load(object sender, EventArgs e)
{
try
{
if (!IsPostBack)
{
BindGridView();
}
}
catch (Exception ex)
{
Response.Write(ex.Message);
}
}

private void BindGridView()
{
ds = app.GetDataSet("Select * from tb_Regstd_mst where Center='" + Request.QueryString["Centre"].ToString() + "' and Quali1='" + Request.QueryString["Course"].ToString() + "'"+
"and Quali2='" + Request.QueryString["Grade"].ToString() + "' order by RollNo Asc");
ViewState["ds"] = ds;
ListView1.DataSource = ds.Tables[0];
ListView1.DataBind();
if (ListView1.Items.Count > 0)
lblmsg.Text = "";
else
lblmsg.Text = "No Student Records Found in this Category.";

}

protected void ListView1_ItemCommand(object sender, ListViewCommandEventArgs e)
{
try
{
if (e.CommandName == "Details")
{
Label id = (Label)e.Item.FindControl("lblid");
Label name = (Label)e.Item.FindControl("lblname");
ViewState["STDID"] = id.Text;
lblname.Text = "Dear " + name.Text + ", login to continue......";
this.mdlpopup1.Show();
//Response.Redirect("StudentProfile.aspx");
}
}
catch (Exception ex)
{
Response.Write(ex.Message);
}

}

Image1: Close.png

Brijesh Solutions

Content

Thursday, 22 August 2013

Open Ajax Modal Popup Extender in ListView ItemCommand in ASP.NET

No comments:

Post a Comment