Hi NoorAhmed,
Refer the below sample.
RegisterNew.ascx
<%@ Control Language="VB" AutoEventWireup="true" CodeFile="RegisterNew.ascx.vb" Inherits="RegisterNew" %>
<div>
<asp:Label ID="LabelMSG" runat="server" CssClass="LabelRegMsg"></asp:Label>
<div style="height: auto;">
<table style="width: 70%; color: #555; text-align: left; margin-top: 70px; margin-left: 20px;">
<tr style="float: left">
<td style="direction: ltr; width: 139px">
<asp:Label ID="LabelEnName" runat="server" Text="Name" CssClass="LabelReg"></asp:Label>
</td>
<td class="style2" style="width: 20%">
<asp:TextBox ID="TextBoxEnglishName" runat="server" CssClass="txtInhousetraining"></asp:TextBox>
</td>
<td style="padding-left: 30px">
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ValidationGroup="A"
ControlToValidate="TextBoxEnglishName" ErrorMessage="Required field"></asp:RequiredFieldValidator>
</td>
</tr>
<tr style="float: left">
<td class="style5">
<asp:Label ID="LabelEmail" runat="server" Text="Email" CssClass="LabelReg"></asp:Label>
</td>
<td class="style1">
<asp:TextBox ID="TextBoxEmail" runat="server" CssClass="txtInhousetraining"></asp:TextBox>
<asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ControlToValidate="TextBoxEmail"
ErrorMessage="Format Email Error" ValidationGroup="A" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"></asp:RegularExpressionValidator>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ValidationGroup="A"
ControlToValidate="TextBoxEmail" ErrorMessage="Required field"></asp:RequiredFieldValidator>
</td>
</tr>
<tr style="float: left">
<td class="style5">
<asp:Label ID="LabelCityName" runat="server" Text="City" CssClass="LabelReg"></asp:Label>
</td>
<td class="style9">
<asp:TextBox ID="TextBoxCityName" runat="server" CssClass="txtInhousetraining"></asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ValidationGroup="A"
ControlToValidate="TextBoxCityName" ErrorMessage="Required field"></asp:RequiredFieldValidator>
</td>
</tr>
<tr style="float: left">
<td class="style3">
<asp:Label ID="LabelCountry" runat="server" Text="Country" CssClass="LabelReg"></asp:Label>
</td>
<td class="style4">
<asp:DropDownList ID="DropDownListCountry" runat="server" CssClass="txtInhousetraining"
Height="30px">
<asp:ListItem Text="Select" />
<asp:ListItem Text="India" />
<asp:ListItem Text="Jordan" />
</asp:DropDownList>
</td>
<td class="style8">
<asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ValidationGroup="A"
ControlToValidate="DropDownListCountry" ErrorMessage="Required field"></asp:RequiredFieldValidator>
</td>
</tr>
<tr style="float: left">
<td class="style5">
<asp:Label ID="LabelPhone" runat="server" Text="Phone/Mobile" CssClass="LabelReg"></asp:Label>
</td>
<td class="style2">
<asp:TextBox ID="TextBoxPhone" runat="server" CssClass="txtInhousetraining"></asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ValidationGroup="A"
ControlToValidate="TextBoxPhone" ErrorMessage="Required field"></asp:RequiredFieldValidator>
</td>
</tr>
<tr style="float: left">
<td class="style3">
<asp:Label ID="Label1" runat="server" Text="Category" CssClass="LabelReg"></asp:Label>
</td>
<td class="style4">
<asp:DropDownList ID="DropDownListCategory" runat="server" CssClass="txtInhousetraining"
Height="30px">
<asp:ListItem Text="Select" />
<asp:ListItem Text="Category 1" />
<asp:ListItem Text="Category 2" />
</asp:DropDownList>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator7" runat="server" ValidationGroup="A"
ControlToValidate="DropDownListCategory" ErrorMessage="Required field"></asp:RequiredFieldValidator>
</td>
</tr>
<tr style="float: left">
<td class="style6" style="vertical-align: top">
<asp:Label ID="LabelMobile0" runat="server" Text="Message" CssClass="LabelReg"></asp:Label>
</td>
<td class="style7">
<asp:TextBox ID="TextComment" runat="server" Height="120px" TextMode="MultiLine"
Style="width: 500px; height: 160px; background-color: #ffffff; border: 1px solid #B9C0CF;
border-radius: 4px;"></asp:TextBox>
</td>
<td class="style7">
</td>
</tr>
<tr>
<td class="style7">
<asp:Button ID="ButtonSubmit" runat="server" Text="Submit" ValidationGroup="A" CssClass="buttonReg"
Style="cursor: pointer; background-color: #ffffff; color: #555; border: 1px solid #B9C0CF;"
OnClick="ButtonSubmit_Click" />
</td>
</tr>
</table>
</div>
</div>
Default2.aspx
<%@ Page Language="VB" AutoEventWireup="true" CodeFile="Default2.aspx.vb" Inherits="Default2" %>
<%@ Register TagPrefix="uc1" Src="~/RegisterNew.ascx" TagName="RegisterNew" %>
<!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></title>
<style type="text/css">
.box
{
background: rgba(255,255,255,0.2);
border-radius: 20px/50px;
background-clip: padding-box;
font-size: 13px;
float: right;
margin-top: 12px;
}
.overlay
{
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgba(0, 0, 0, 0.7);
transition: opacity 500ms;
visibility: hidden;
opacity: 0;
}
.overlay:target
{
visibility: visible;
opacity: 1;
}
.popup
{
margin: 100px auto;
padding: 25px;
background: #fff;
border-radius: 5px;
width: 35%;
position: relative;
transition: all 5s ease-in-out;
height: 45%;
}
.popup h2
{
margin-top: 0;
color: #333;
font-family: Tahoma, Arial, sans-serif;
}
.popup .close
{
position: absolute;
top: 20px;
right: 30px;
transition: all 200ms;
font-size: 30px;
font-weight: bold;
text-decoration: none;
color: #333;
}
.popup .close:hover
{
color: #06D85F;
}
.popup .content
{
max-height: 30%;
overflow: auto;
}
@media screen and (max-width: 700px)
{
.box
{
width: 70%;
}
.popup
{
width: 70%;
}
}
.login
{
position: relative;
margin: 0 auto;
padding: 20px 20px 20px;
width: 310px;
background: white;
border-radius: 3px;
-webkit-box-shadow: 0 0 200px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.3);
box-shadow: 0 0 200px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.3);
}
.login:before
{
content: '';
position: absolute;
top: -8px;
right: -8px;
bottom: -8px;
left: -8px;
z-index: -1;
background: rgba(0, 0, 0, 0.08);
border-radius: 4px;
}
.login h1
{
margin: -20px -20px 21px;
line-height: 40px;
font-size: 15px;
font-weight: bold;
color: #555;
text-align: center;
text-shadow: 0 1px white;
background: #f3f3f3;
border-bottom: 1px solid #cfcfcf;
border-radius: 3px 3px 0 0;
background-image: -webkit-linear-gradient(top, whiteffd, #eef2f5);
background-image: -moz-linear-gradient(top, whiteffd, #eef2f5);
background-image: -o-linear-gradient(top, whiteffd, #eef2f5);
background-image: linear-gradient(to bottom, whiteffd, #eef2f5);
-webkit-box-shadow: 0 1px whitesmoke;
box-shadow: 0 1px whitesmoke;
}
.login p
{
margin: 20px 0 0;
height: auto;
}
.login p:first-child
{
margin-top: 0;
}
.login input[type=text], .login input[type=password]
{
width: 278px;
}
.login p.remember_me
{
float: left;
line-height: 31px;
}
.login p.remember_me label
{
font-size: 12px;
color: #777;
cursor: pointer;
}
.login p.remember_me input
{
position: relative;
bottom: 1px;
margin-right: 4px;
vertical-align: middle;
}
.login p.submit
{
text-align: right;
}
:-moz-placeholder
{
color: #c9c9c9 !important;
font-size: 13px;
}
::-webkit-input-placeholder
{
color: #ccc;
font-size: 13px;
}
input
{
font-family: 'Lucida Grande' , Tahoma, Verdana, sans-serif;
font-size: 14px;
}
input[type=text], input[type=password]
{
margin: 5px;
padding: 0 10px;
width: 200px;
height: 34px;
color: #404040;
background: white;
border: 1px solid;
border-color: #c4c4c4 #d1d1d1 #d4d4d4;
border-radius: 2px;
outline: 5px solid #eff4f7;
-moz-outline-radius: 3px;
-webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.12);
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.12);
}
input[type=text]:focus, input[type=password]:focus
{
border-color: #7dc9e2;
outline-color: #dceefc;
outline-offset: 0;
}
input[type=submit]
{
padding: 0 18px;
height: 29px;
font-size: 12px;
font-weight: bold;
color: #527881;
text-shadow: 0 1px #e3f1f1;
background: #cde5ef;
border: 1px solid;
border-color: #b4ccce #b3c0c8 #9eb9c2;
border-radius: 16px;
outline: 0;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
-webkit-box-shadow: inset 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.15);
box-shadow: inset 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.15);
}
input[type=submit]:active
{
background: #cde5ef;
border-color: #9eb9c2 #b3c0c8 #b4ccce;
-webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.2);
box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.2);
}
.lt-ie9 input[type=text], .lt-ie9 input[type=password]
{
line-height: 34px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager runat="server">
</asp:ScriptManager>
<asp:LinkButton ID="SignUp" runat="server" Text="Sign"><a href="#popup1">SignUp</a></asp:LinkButton>
<br />
<div id="popup1" class="overlay">
<div class="popup">
<a class="close" href="#">×</a>
<uc1:RegisterNew runat="server" ID="RegisterNew"></uc1:RegisterNew>
</div>
</div>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<asp:UpdatePanel runat="server" ID="UpdatePanel1" UpdateMode="Conditional">
<ContentTemplate>
<div style="-webkit-border-left-radius: 8px; border: 0px solid #808080; float: left;
margin: 0px; border-radius: 7px; width: 99%; padding-left: 4px;">
<div id="Div1" class="oddRow" style="width: 100%;">
<asp:HiddenField ID="hfEnglishName" runat="server" />
<asp:Repeater ID="RepeaterCourse" runat="server">
<ItemTemplate>
<div style="width: 30%;">
<asp:Label ID="LabelEnglishName" runat="server" CssClass="LabelReg" Text='<%# Eval("EnglishName")%>'></asp:Label>
</div>
<div>
<label id="CityCountry" style="float: left; margin-left: -15px; margin-right: 15px;
color: maroon; font-size: 13px; text-align: center; width: 20%; margin-top: 20px;">
<%# Eval("CityCountry")%></label>
<label id="StartCourse" style="float: left; color: maroon; font-size: 13px; width: 20%;
margin-left: 15px; margin-right: -13px; margin-top: 20px;">
<%# Eval("StartCourse", "{0:MMM dd, yyyy}")%></label>
<label id="EndCourse" style="float: left; color: maroon; font-size: 13px; width: 20%;
margin-top: 20px;">
<%# Eval("EndCourse", "{0:MMM dd, yyyy}")%></label>
<label id="Days" style="float: left; width: 20%; margin-top: 20px;">
<%# Eval("Days")%></label>
<asp:Button ID="Button1" Text="Register" runat="server" OnClick="OnRegister" />
</div>
</ItemTemplate>
</asp:Repeater>
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
RegisterNew.ascx.vb
Protected Sub ButtonSubmit_Click(sender As Object, e As System.EventArgs)
Dim body As String = "Email: " + TextBoxEmail.Text + "<br>" + "Name: " + TextBoxEnglishName.Text + "<br>" + "Country: " + DropDownListCountry.SelectedItem.ToString() + "<br>" + "City: " + TextBoxCityName.Text + "<br>" + "Phone: " + TextBoxPhone.Text + "<br>" + "Category: " + DropDownListCategory.SelectedValue + "<br>" + "<br>" + "<br>" + "Message: " + TextComment.Text + "<br>" + TryCast(Page.FindControl("hfEnglishName"), HiddenField).Value
Dim mail As New System.Net.Mail.MailMessage()
mail.[To].Add("noor@gmail.com")
mail.Bcc.Add("noor@gmail.com")
mail.From = New MailAddress("noor@gmail.com")
mail.Subject = "From Inhouse Training ....By "
mail.Body = body
mail.IsBodyHtml = True
Dim smtp As New SmtpClient("relay-hosting.secureserver.net")
smtp.EnableSsl = False
smtp.UseDefaultCredentials = True
smtp.Send(mail)
LabelMSG.Text = "Sent Successfully"
End Sub
Default2.aspx.vb
Protected Sub Page_Load(sender As Object, e As EventArgs)
If Not Me.IsPostBack Then
Dim dt As New DataTable()
dt.Columns.AddRange(New DataColumn() {New DataColumn("EnglishName"), New DataColumn("CityCountry"), New DataColumn("StartCourse", GetType(DateTime)), New DataColumn("EndCourse", GetType(DateTime)), New DataColumn("Days", GetType(Integer))})
dt.Rows.Add("LTW", "Jeddah, Soudi Arabia", "11/20/2016", "11/24/2016", 1)
dt.Rows.Add("ATPP", "Jeddah, Soudi Arabia", "11/20/2016", "11/20/2016", 2)
dt.Rows.Add("TOT", "Jeddah, Soudi Arabia", "11/20/2016", "11/20/2016", 3)
dt.Rows.Add("ID IAMS", "Jeddah, Soudi Arabia", "11/20/2016", "11/20/2016", 4)
RepeaterCourse.DataSource = dt
RepeaterCourse.DataBind()
End If
End Sub
Protected Sub OnRegister(sender As Object, e As System.EventArgs)
Dim register As Button = TryCast(sender, Button)
hfEnglishName.Value = TryCast(register.NamingContainer.FindControl("LabelEnglishName"), Label).Text
End Sub
Screenshot
