S.S.
D COLLEGE BARNALA
(Affiliated to Punjabi University Patiala)
PRACTICAL FILE
OF
WEB DESIGNING USING ASP.NET
(Software lab-XII)
Submitted to : Submitted By:
Prof. Kamalpreet Kaur Name……………..
(Department of Roll no……………
Computer science) Class………………
INDEX
SR.NO PROGRAM NAME PAGE NO. SIGNATURE
1. ASP.NET Overview 1-1
2. Write a Program to show the user standard controls in web form.
2-6
3. Write a Program containing the list control and its functions. 7-8
4. Write a Program to show the use of file upload and calendar control. 9-11
5. Write a Program to display advertisement on a web page. 12-13
6. Write a Program to create an admission form for a college. 14-18
7. Write a Program to demonstrate the Master Page. 19-20
8. Write a Program to create Login Page which accepts user input name and 21-22
Validate it with Required Field validation.
9. Write a Program that demonstrates different Validation Controls. 23-25
10. Create a user Control that displays the current date and Time in web 26-27
Form.
ASP.NET OVERVIEW
It is a web framework designed and developed by Microsoft. It is used to develop websites, web applications and web
services. It provides fantastic integration of HTML, CSS and JavaScript. It was first released in January 2002. It is built on
the Common Language Runtime (CLR) and allows programmers to write code using any supported .NET language.
ASP.NET provides three development styles for creating web applications:
1. Web Forms
2. ASP.NET MVC
3. ASP.NET Web Pages
Web Forms
It is an event driven development framework. It is used to develop application with powerful data access. It provides
server side controls and events to create web application. It is part of the ASP.NET framework. We will discuss it further
in next chapters.
ASP.NET MVC
It gives us a MVC (Model View Controller), patterns-based way to build dynamic websites. It enables a clean separation
of concerns and that gives you full control over markup for enjoyable, agile development. It also provides many features
that enable fast development for creating outstanding applications. We will discuss it further in next chapters.
ASP.NET Web Pages
It is used to create dynamic web pages. It provides fast and lightweight way to combine server code with HTML. It helps
to add video, link to the social sites. It also provides other features like you can create beautiful sites that conform to the
latest web standards.
1
1. Write a Program to show the use of standard controls in a web forms.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="Program1.WebForm1"
%>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<table>
<tr>
<td>Student Name</td>
<td colspan="6">
<asp:TextBox ID="txtStdName" runat="server">
</asp:TextBox>
</td>
</tr>
<tr>
<td>Father Name</td>
<td colspan="6">
<asp:TextBox ID="txtfatName" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>Gender</td>
<td>
<asp:RadioButton ID="optMale" runat="server" GroupName="G1" Text="Male" />
</td>
<td>
<asp:RadioButton ID="optFemale" runat="server" GroupName="G1" Text="Female"/>
</td>
<td> </td>
</tr>
<tr>
<td>Hobbies</td>
<td>
<asp:CheckBox ID="chkRead" runat="server" Text="Reading" />
</td>
<td>
<asp:CheckBox ID="chksing" runat="server" Text="Singing" />
</td>
<td>
<asp:CheckBox ID="chkDance" runat="server" Text="dancing"/>
</td> 2
</tr>
<tr>
<td> </td>
<td> </td>
<td class="auto-style1"> </td>
<td> </td>
</tr>
<tr>
<td colspan="3">
<asp:Button ID="Submit" runat="server" OnClick="btnSubmit_Click" Text="Submit" />
</td>
</tr>
<tr>
<td colspan="3">
<asp:Label ID="lblDetails" runat="server" Visible="false"></asp:Label>
</td>
</tr>
<tr>
<td colspan="3">
<asp:Label ID="lblstdName" runat="server" Visible="false"></asp:Label>
</td>
</tr>
<tr>
<td colspan="3">
<asp:Label ID="lblfatName" runat="server" Visible="false"></asp:Label>
</td>
</tr>
<tr>
<td colspan="3">
<asp:Label ID="lblGen" runat="server" Visible="false"></asp:Label>
</td>
</tr>
<tr>
<td colspan="3">
<asp:Label ID="lblHobbies" runat="server" Visible="false"></asp:Label>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
3
CS File:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace Program1
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void btnSubmit_Click(object sender, EventArgs e)
{
//make label visible to the page
lblDetails.Visible = true;
lblstdName.Visible = true;
lblfatName.Visible = true;
lblGen.Visible = true;
lblHobbies.Visible = true;
//setting text to the label
lblstdName.Text = "Student Name: " + txtStdName.Text;
lblfatName.Text = "Father name: " + txtfatName.Text;
//Radio
if (optMale.Checked == true)
{
lblGen.Text = "Gender: Male";
}
else
{
lblGen.Text = "Gender: Female";
}
//checkBox
if (chkRead.Checked == true)
{
lblHobbies.Text = "Hobbies: Reading";
}
if (chksing.Checked == true)
{
lblHobbies.Text = "Hobbies: Singing";
}
if (chkDance.Checked == true)
{
lblHobbies.Text = "Hobbies: Dance";
}
protected void Page_Load(object sender, EventArgs e) 4
{
lblDetails.Text = "---------Data Submitted-----------";
lblstdName.Text = "Student Name";
lblfatName.Text = "Father Name";
lblGen.Text = "Gender";
lblHobbies.Text = "Hobbies";
}
}
}
5
Output:
6
2. Write program containing the list control and its functions
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="p2.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.auto-style1
{ margin-left:
0px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Label ID="Label0" runat="server" Text="List Controls and its function"></asp:Label>
<br />
<br />
<asp:Button ID="Button1" runat="server" Height="50px" Text="1" Width="100px" BackColor="#ccccff"
CssClass="auto-style1" />
<asp:Label ID="Label1" runat="server" Text="Back Color"></asp:Label>
<br />
<br />
<asp:Button ID="Button2" runat="server" Height="50px" Text="2" Width="100px" BorderColor="Orange" />
<asp:Label ID="Label2" runat="server" Text="Border Color"></asp:Label>
<br />
<br />
<asp:Button ID="Button3" runat="server" Height="50px" Text="3" Width="100px" BorderStyle="Dashed" />
<asp:Label ID="Label3" runat="server" Text="Border Style"></asp:Label>
<br />
<br />
<asp:Button ID="Button4" runat="server" Height="50px" Text="4" Width="100px" Font-Bold="true" />
<asp:Label ID="Label4" runat="server" Text="Font"></asp:Label>
<br />
<br />
<asp:Button ID="Button5" runat="server" Height="50px" Text="5" Width="100px" ForeColor="Blue" Font-
Bold="true" />
<asp:Label ID="Label5" runat="server" Text="Fore Color"></asp:Label>
<br />
</div>
</form>
</body>
</html>
7
Output:
8
3. Write a program to show the use of file upload and calendar Control.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="p3.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<table>
<tr>
<td style="width:300px">Select a file to upload</td>
<td style="width:242px">
<asp:FileUpload ID="FileUpload1" runat="server" />
</td>
<td align="right" style="width:392px">
<asp:Button ID="btnUpload" runat="server"
OnClick="btnUpload_Click" Text="Upload" />
</td>
</tr>
<tr>
<td style="width:300px"></td>
<td style="width:242px">
<asp:Label ID="Label1" runat="server"></asp:Label>
</td>
<td style="width:392px"></td>
</tr>
<asp:Calendar ID="Calender1" runat="server" OnSelectionChanged="Calender1_SelectionChanged">
</asp:Calendar>
</table>
</div>
</form>
</body>
</html>
CS File:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace p3
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void btnUpload_Click(object sender, EventArgs e) 9
{
if (FileUpload1.HasFile)
{
string s = Server.MapPath("~/Desktop");
//s = s + "\\" + FileUpload1.FileName;
FileUpload1.SaveAs(s);
Label1.Text = "Uploaded successfully";
}
else
{
Label1.Text = "No File selected";
}
}
protected void Calender1_SelectionChanged(Object sender, EventArgs e)
{
Response.Write("Selected date is: " + Calender1.SelectedDate.ToLongDateString());
}
}
}
10
Output:
11
4. Write a program to display advertisement on a web page.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="p44.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:AdRotator ID="AdRotator1"
runat="server" AdvertisementFile="~/file.xml"
Height="150px"
Width="400px" />
</div>
</form>
</body>
</html>
XML File:
<?xml version="1.0" encoding="utf-8"?>
<Advertisements>
<Ad>
<ImageUrl>Google.gif</ImageUrl>
<NavigateUrl>http://www.Google.com</NavigateUrl>
<AlternateText>Google Image Not Available</AlternateText>
<Impressions>20</Impressions>
<keyword>Google</keyword>
</Ad>
<Ad>
<ImageUrl>Yahoo.gif</ImageUrl>
<NavigateUrl>http://www.Yahoo.com</NavigateUrl>
<AlternateText>Yahoo Image not Available</AlternateText>
<Impression>20</Impression>
<keyword>Yahoo</keyword>
</Ad>
<Ad>
<ImageUrl>Facebook.gif</ImageUrl>
<NavigateUrl>http://www.facebook.com</NavigateUrl>
<AlternateText>facebook Image not Available</AlternateText>
<Impression>20</Impression>
<keyword>Fecbook</keyword>
</Ad>
<!-- More ads can go here.-->
</Advertisements>
12
Output:
13
5. Write a program to create an admission form for a College.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="p5.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Wizard ID="Wizard1" runat="server" Width="467px"
BackColor="#EFF3FB" BorderColor="#B5C7DE"
BorderWidth="1px"
ActivestepIndecx="0">
<WizardSteps>
<asp:WizardStep ID="WizardStep1" runat="server"
Title="Personal">
<h3>Personal Profile</h3>
<table>
<tr>
<td>Name:</td>
<td><asp:TextBox ID="TextBox1" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td>Age:</td>
<td><asp:TextBox ID="TextBox2" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td>Father's Name:</td>
<td><asp:TextBox ID="TextBox3" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td>Address:</td>
<td><asp:TextBox ID="TextBox4" runat="server"></asp:TextBox></td>
</tr>
</table>
<br />
</asp:WizardStep>
<asp:WizardStep ID="WizardStep2" runat="server"
Title="Education">
<h3>Education Details</h3>
<table>
<tr>
<td>Prvious Course:</td>
<td><asp:DropDownList ID="DropDownList1" runat="server"
Height="20px" Width="165px">
<asp:ListItem>+2(Arts)</asp:ListItem>
<asp:ListItem>+2(Commerce)</asp:ListItem>
<asp:ListItem>+2(Medical)</asp:ListItem> 14
<asp:ListItem>+2(Non-Medical)</asp:ListItem>
</asp:DropDownList></td>
</tr>
<tr>
<td>Prvious Course:</td>
<td><asp:DropDownList ID="DropDownList2" runat="server"
Height="20px" Width="165px">
<asp:ListItem>BA</asp:ListItem>
<asp:ListItem>B.COM</asp:ListItem>
<asp:ListItem>BCA</asp:ListItem>
<asp:ListItem>B.Sc</asp:ListItem>
</asp:DropDownList></td>
</tr>
</table>
<br />
</asp:WizardStep>
<asp:WizardStep ID="Complete" runat="server" Title="Complete"
StepType="Complete">
<br />
Thankyou For Completing this Form.
</asp:WizardStep>
</WizardSteps>
</asp:Wizard>
</div>
</form>
</body>
</html>
15
Output:
16
17
18
6. Write a Program to demonstrate the master page.
<%@ Page Language="C#" AutoEventWireup="true" MasterPageFile="~/Site1.Master"
CodeBehind="UseMasterPage.aspx.cs" Inherits="p6.UseMasterPage" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceholder1"
runat="server">
<p>Left Content Place Holder.</p>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceholder2"
runat="server">
<p>Right Content Place Holder.</p>
</asp:Content>
Master File:
<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site1.master.cs" Inherits="p6.Site1" %>
<!DOCTYPE html>
<html>
<head runat="server">
<title></title>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<table cellpadding="3" border="1">
<tr bgcolor="silver">
<td colspan="2">
<h1>Header of the Page</h1>
</td>
</tr>
<tr>
<td><asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder></td>
<td><asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server">
</asp:ContentPlaceHolder></td>
</tr>
<tr>
<td colspan="2">
Copyright 2013- ASP.NET
</td>
</tr>
</table>
</form>
</body>
</html>
19
Output:
20
7. Write a program that demonstrates a text box for a user input name and validate it with require Field
Validation.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="p9.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.auto-style1
{ height:
26px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<table>
<tr>
<td>Enter your Name</td>
<td>
<asp:TextBox ID="TextBox1" runat="server">
</asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
ControlToValidate="TextBox1" ErrorMessage="Required">
</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td colspan="3">
<asp:Button ID="Button1" runat="server" Text="submit" />
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
21
Output:
22
8. Write a program to demonstrate different validation controls.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="p9.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<table>
<tr>
<td>Enter your Name</td>
<td>
<asp:TextBox ID="TextBox1" runat="server">
</asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
ControlToValidate="TextBox1" ErrorMessage="Field Must Not Be Empty">
</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>Enter your Marks</td>
<td>
<asp:TextBox ID="TextBox2" runat="server">
</asp:TextBox>
</td>
<td>
<asp:RangeValidator ID="RangeValidator1" runat="server"
ControlToValidate="TextBox2"
ErrorMessage="Enter your Marks in Range(1-100)"
MaximumValue="100" MinimumValue="1" Type="Integer">
</asp:RangeValidator>
</td>
</tr>
<tr>
<td>Enter Name</td>
<td><asp:TextBox ID="TextBox3" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td>Re-Enter Name</td>
<td><asp:TextBox ID="TextBox4" runat="server"></asp:TextBox>TextDoes not Match</td>
<td><asp:CompareValidator ID="CompareValidator1" runat="server"
ControlToCompare="TextBox3" ControlToValidate="TextBox1"
ErrorMessage="TextDoes not Match"></asp:CompareValidator>
23
</td>
</tr>
<tr>
<td>Enter Your Email-ID</td>
<td><asp:TextBox ID="TextBox5" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td>
<asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server"
ControlToValidate="TextBox5" ErrorMessage="Regular Expressiondoes not match"
validationExpression="\w+([-+.')*@\w+([-.\w+)\.\w+([-.]\w+)*">
</asp:RegularExpressionValidator>
</td>
</tr>
<tr>
<td colspan="3">
<asp:Button ID="Button1" runat="server" Text="submit"/>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
24
Output:
25
9. Create a user Control that displays the current date and time.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="p10.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Label ID="Label1" runat="server" Text="Label" BackColor="Pink" BorderColor="Yellow"
BorderStyle="Dotted" ForeColor="Blue"></asp:Label>
</div>
</form>
</body>
</html>
CS File:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace p10
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
Label1.Text = "server Date and Time is:"+DateTime.Now.ToString();
}
}
}
26
Output:
27