WT File

Practical File (Web Technology)
Submitted in partial fulfillment of the requirements For the award of the degree of
Master of Computer Application (MCA) To Guru Gobind Singh Indraprastha University, Delhi
Guide: Submitted by: Miss.Yogita Negi
Name : Ashish Verma Semester: 4th Semester Roll No-47
Banarsidas Chandiwala Institute of Information Technology, New Delhi - 110019

Batch (2011-2014)
S.no 1.
List of practicals
Create a HTML static web page which uses different controls to develop a admission form for Admission to undergraduate Program etc Create a HTML static web page which uses different controls to develop a time table for MCA IV semester.
Page No. 3
Signature
2.
3. 4.
Create a HTML static website to compute telephone bill. Create a HTML website that creates multiple frames within your Web tech web site such that on clicking a hyperlink it should be opened in second frame & provide information about particular link Create a HTML form which displays different validation in address form using java script.
8 12
5.
16
6.
Create a form using JavaScript that includes all types of Popup Boxes.
18
7.
Write a script to which will take name as a input from user and display greeting message to the user according time of the day.If time is less than or equal to 12PM then Good Morning with User nameIf time is between to 12 PM to 3 PM then Good After noon with User name.And if time is greater than 3 PM then Good Morning with User name
20
8. 9.
Write a javascript to calculate employee salary. Create a HTML form with the use of different pseudo elements & classes of Cascading Style Sheets. Create a DHTML script in order to change visibility of different images
Create a web site for Employee Registration and put the right validations on the forms
22 24
10 12
25 28
1. Create a HTML static web page which uses different controls to develop a admission form for Admission to undergraduate Program etc
<html> <head> <h2> <center><u> Banarasidas Chandiwala Institute of Information Technology </u><center> </h2> <h2> <center><u> New Delhi </u><center> </h2> <h3> <center><u> Admission Form </u><center> </h3> </head> <body bgcolor="WHITE"> <ol> <img width=150 height=150 border=3 align=right hspace=300><br> <li>Applicant'sName: <input type= "text" name="text1" value=""><br></li> <li>Mother's Name:&nbsp&nbsp <input type="text" value=""><br></li> <li>Father's Name:&nbsp&nbsp&nbsp&nbsp<input type="text" value=""><br></li> <li>Email id:&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp<input type= "text" name="text1" value=""><br></li> <li>DOB:&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp& nbsp&nbsp&nbsp&nbsp<input type= "text" name="text1" value=""><br></li> <li>Phone: <br> Landline:&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp<input type= "text" name="text1" value=""><br> Mobile:&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp<input type= "text" name="text1" value=""><br></li> <li>Address: <br> Permanent:&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <textarea rows ="5" columns="7"> </textarea><br> Present: &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <textarea rows ="5" columns="7"> </textarea><br></li> <li>Category:<br> <input type="radio" name="ctg" value="SC"/>SC<br> <input type="radio" name="ctg" value="ST"/>ST<br> <input type="radio" name="ctg" value="GEN"/>GEN<br> <input type="radio" name="ctg" value="OBC"/>OBC<br> <input type="radio" name="ctg" value="PH"/>PH<br></li> <li>Gender:<br> <input type="radio" name="gend" value="male">Male<br> <input type="radio" name="gend" value="female">Female<br></li> <li> Region: <br> <input type="radio" name="regn" value="delhi">Delhi<br> <input type="radio" name="regn" value="out delhi">Outside Delhi<br></li> <li>Nationality:
<input type="text" value=""><br></li> <li>Course Applied For:<br> <select name="course" size="1"> <option value="Select Course">select</option> <option value="BCA">BCA</option> <option value="BCA">B.Sc.</option> <option value="BCA">B.Com</option> <option value="BCA">B.A.</option> <option value="BCA">B.Ed.</option> </select><br></li> </ol> Qualification:<br> <table border="1" width="20"> <tr> <th> EXAMINATION PASSED </th> <th> YEAR</th> <th> DIVISION/ MARKS</th> <th> AGE</th> <th> SCHOOL/BOARD</th> </tr> <tr> <td> Matric</td> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td>10+2</td> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td>Any other exam (specify)</td> <td></td> <td></td> <td></td> <td></td> </tr> </table> <br>
<b><i>DECLARATION:</b></i> <p> I declare that i am applying for addmission and the partivulars given above are correct. I have read the prospectus of the institute as well as the admission requirements. I agree to abide by the rules and regulations given terein.I further declare thar I shall submit myself to the disciplinary jurisdiction of the principal and other authorities of the institute</p> <p> I understand that the facility for payement of tution fee in 2 instalments is solely for my convinence and I undertake to pay the tution fee even if i leave the institute in mid-session.</p> <b>Date</b>: &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <input type= "text" align="right" name="text1" value=""><br> <b>Signature:</b> </pre> </body> </html> OUTPUT:
2. Create a HTML static web page which uses different controls to develop a time table for MCA IV semester
<html> <head> </head> <title> Time-Table </title> <body> <table align=center border=10 width=75%> <caption><b>Time-Table Sem- IV</caption> <tr><th>Day<th>I<th>II<th>Break<th>III<th>IV<th>Break<th>V<th>VI <tr><td><b>Mon<td>Web-tech<td>OOA&D<td>Break<td>DCN<td>Data-Mining<td>Break<td>Labwt/OOA&D<td>web-technology <tr><td><b>Tue<td>DCN<td>Data-Mining<td>Break<td>web-tech<td>OOA&D<td>Break<td>Labwt/OOA&D<td>DCN <tr><td><b>Wed<td>OOA&D<td>Lab-DCN/LabOOA&D<td>Break<td>NUES<td>DCN<td>Break<td>Lab-Dcn/Data-mining<td>web-tech <tr><td><b>Thur<td>Data-Mining<td>OOA&D<td>Break<td>DCN<td>web-tech<td>Break<td>Labwt/OOA&D<td>OOA&D <tr><td><b>Fri<td>Web-technology<td>OOA&D<td>Break<td>DataMining<td>DCN<td>Break<td>Lab-wt/OOA&D<td>NUES </table> </body> </html> OUTPUT:
3. Create a HTML static website to compute telephone bill. <html> <head> <h1><center><u>MAHANAGAR TELEPHONE NIGAM LIMITED</u></center></h1> </head> <body> Account No. &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp 2053254589 &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp& nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp BILLING PERIOD &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp From 01-03-2010 &nbsp&nbsp&nbsp&nbspTo &nbsp&nbsp&nbsp&nbsp31-03-2010 <br> Name &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp Mr.Ashish Verma &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp& nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp Category Code &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp Delhi <br>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbs p&nbsp Rz-123/32, C-1 Janakpuri &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp& nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp Tarrif plan &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
TRI COMBO UNLIMITED<br> &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp New delhi-110058 &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp Telephone number &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp 25381336<br> &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp& nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp& nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp Invoice Date &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp 13-02-2010<br> &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp& nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp& nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp Invoice Number &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp WRQV-01731210-10<br> &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp& nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp& nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp Amount Due &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp 757.00 <br> &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp& nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp Due Date &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp 31-03-2010<br><hr> <table border="3" width= "20%" cellpadding="10%"align="CENTER"> <caption align="CENTER"> <h3>ACCOUNT SUMMARY</h3></caption> <tr> <th> PREVIOUS BALANCE </th> <td> </td> <th> PAYMENTS RECEIVED </th> <td> </td> <th> CURRENT CHARGES </th> <td> </td> <th> NET PAYABLE AMOUNT BY DUE DATE </th> <td> </td> <th> NET PAYABLE AMOUNT AFTER DUE DATE </th> </tr> <tr> <td>225.00</th> <td rowspan=2> - </td> <td> 225.00 </th> <td> + </td> <td>757.00 </th> <td> = </td> <td> 757.00 </th>
<td> </td> <td> 777.00 </th> </tr></table> <hr> <table border="3" width= "20%" cellpadding ="10%"align="Right"> <caption><h3> BILL SUMMARY</h3><caption> <tr> <th> Description </th> <th> Ammount </th> </tr> <ol> <tr> <td> <li> Monthly charges </li></td> <td> 250.00 </td> </tr> <tr> <td> <li>Topup </li></td> <td> 00.00 </td> </tr> <tr> <td> <li>VAS/Others </li></td> <td> 00.00 </td> </tr> <tr> <td> <li> Discounts </li></td> <td> 00.00 </td> </tr> <tr> <td><li> Call Charges</li></td> <td> 757.00 </td> </tr> <h5> <tr> <td> Amount to be paid </td> <td> 757.00 </td><br> </tr> <tr> <td> Payment After Due Date</td> <td> 777.00 </td> </tr> </tr> </ol> </body> </html>
OUTPUT:
4. Create a HTML website that creates a hyperlink. It should be opened in second frame and provide information about particular link.
Frame.html <html> <frameset rows="20%,60%,20%"> <frame src= "up.html" > </frame> <frameset cols = "30%,70%"> <frame src= "left.html" > </frame> <frame src= "right.html" name= "right"> </frame> </frameset> <frame src= "down.html" > </frame> </frameset></html> UP.html <html> <body > <h1><center> WELCOME TO THE WEB TECH. PROJECTS <center></h1> </body> </html>
Down.html <html> <body> <h4><center>WEBSITE CREATED BY: VIBHOR MITTAL<center></h4> <h4><center>EMAIL ID: vibhormitt@gmail.com<center></h4> <h4><center>LAST MODIFIED DATE: 27- JAN- 2013<center></h4> </body> </html> Left.html <html> <body> <dl> <dt> <a href = "description.html" target= "right"> DESCRIPTION </a></dt> <dd> -of your project/ subject </dd> </dl> <dl> <dt> <a href = "references.html" target= "right"> REFERENCES </a> </dt> <dd> - websites to research </dd> </dl> <dl> <dt> <a href = "bibllography.html" target= "right"> BIBLLOGRAPHY </a></dt> <dd> -other print resources </dd> </dl> </body> </html> Right.html <html> <body> <h3> welcome</h3> </body> </html> Bibllography.html <html> <body background ="Penguins.jpg"> <h2>The books to be reffered</h2> <ul> <li> K.K. Sharma, "Web Technology", A.B Publication delhi, First edition,2008 </li> <li> Stephen Walther, "ASP .NET" ,pearson education, second addition</li> <li> Ethan Cerami, "Web Services" , O'Reilly Media, 2002</li> </ul> </body> </html> Description.html <html> <body background ="Penguins.jpg"> <h2><center> HTML <center></h2>
<p> HyperText Markup Language (HTML) is the main markup language for displaying web pages and other information that can be displayed in a web browser. HTML is written in the form of HTML elements consisting of tags enclosed in angle brackets (like <html>), within the web page content. HTML tags most commonly come in pairs like (and), although some tags, known as empty elements, are unpaired. The first tag in a pair is the start tag, the second tag is the end tag (they are also called opening tags and closing tags). In between these tags web designers can add text, tags, comments and other types of text-based content. </p> <h2><center> ASP.NET <center></h2> <p> ASP.NET is a server-side Web application framework designed for Web development to produce dynamic Web pages. It was developed by Microsoft to allow programmers to build dynamic web sites, web applications and web services. It was first released in January 2002 with version 1.0 of the .NET Framework, and is the successor to Microsoft's Active Server Pages (ASP) technology. ASP.NET is built on the Common Language Runtime (CLR), allowing programmers to write ASP.NET code using any supported .NET language. The ASP.NET SOAP extension framework allows ASP.NET components to process SOAP messages. </p> <h2> <center> ADO .NET <center></h2> <p> ADO.NET is a set of computer software components that programmers can use to access data and data services based on disconnected DataSets and XML. It is a part of the base class library that is included with the Microsoft .NET Framework. It is commonly used by programmers to access and modify data stored in relational database systems, though it can also access data in non-relational sources. ADO.NET is sometimes considered an evolution of ActiveX Data Objects (ADO) technology, but was changed so extensively that it can be considered an entirely new product. </p> </body> </html> References.html <html> <body background ="Penguins.jpg"> <h2> The references for HTML </h2> <ul> <li> http://www.w3schools.com/html/default.asp</li> <li> http://www.html.net/tutorials/html/ </li> <li> http://www.tizag.com/htmlT/ </li> <li> http://www.quackit.com/html/tutorial/ </li> </ul> <h2> The references for ASP .NET </h2> <ul> <li> http://en.wikipedia.org/wiki/ASP.NET </li> <li> http://www.w3schools.com/aspnet/default.asp </li> <li> http://www.tutorialspoint.com/asp.net/index.htm </li> <li> http://www.asp.net/mvc/tutorials </li>
</ul> <h2> The references for ADO .NET </h2> <ul> <li> http://www.w3schools.com/ado/default.asp </li> <li> http://www.vtc.com/products/Microsoft-ADO.NET-tutorials.htm </li> <li> http://progtutorials.tripod.com/ADO_NET.htm </li> <li> http://www.codeproject.com/Articles/361579/A-Beginners-Tutorial-for-UnderstandingADO-NET</li> </ul> </body> </html> OUTPUT:
5. Create a form using JavaScript that includes all types of Popup Boxes.
<html> <head> <h2><center> POPUP BOXES IN JAVASCRIPT </center> </h2> <script type="text/JavaScript"> var name=""; function hello() { alert('you see the alert pop-up box'); } function value() { var answer = confirm("Is this a Confirm box"); if (answer) { alert("Yes, I amconfirm box"); } }
function hi() { name=prompt('Enter your name:','Name'); alert('Hello '+name+', Welcome to my page!'); } </script> </head> <body onLoad="value()"> <form> <input type="button" value="Alert" onClick="hello()"/> <input type="button" value="Prompt" onClick="hi()"/> </form></body></html> OUTPUT: Confirm Pop-up:
Alert Pop-up:
Prompt Pop-up:
6. Write a javascript to calculate Employee Salary. <html> <script> function calc(form) { var bs = form.basic.value; var hr = (bs * 50) / 100; form.hra.value = hr; var ren = 5000; form.rent.value = ren; var med = 1000; form.medical.value = med; var trav = 2000; form.travel.value = trav; var spec = (bs * 15) / 100; form.special.value = spec; var gs = hr + ren + med + trav + spec; form.gsal.value = parseInt(form.basic.value) + parseInt(gs); form.pf.value = (bs * 12) / 100; form.itax.value = (bs * 10) / 100; } </script> <body> <form> <h1><center><b> Employee Salary Form </b></center></h1> <br> <p> Enter Name of the Employee: &nbsp&nbsp&nbsp&nbsp <input type="text" name="name" maxlength="30" size="30" autofocus> </p> <p> Enter Employee Number: &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <input type="text" name="empno" maxlength="6" size="30"> </p> <p> Salary for the month of: &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <input type="text" name="month" maxlength="10" size="20"> </p> <p> Date: &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb
sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp& nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <input type="text" name="date" maxlength="6" size="20"> </p> <p> Enter Basic Salary: &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <input type="text" name="basic" maxlength="6" size="20" onchange="calc(this.form);"> </p> <p> HRA: &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp& nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <input type="text" name="hra" maxlength="4" size="20" readonly> </p> <p> Rent Allowance: &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <input type="text" name="rent" maxlength="4" size="20" readonly> </p> <p> Medical Allowance: &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp <input type="text" name="medical" maxlength="4" size="20" readonly> </p> <p> Travel Allowance: &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <input type="text" name="travel" maxlength="4" size="20" readonly> </p> <p> Special Allowance: &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <input type="text" name="special" maxlength="4" size="20" readonly> </p> <p><b> Gross Salary:</b> &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbs p&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <input type="text" name="gsal" maxlength="4" size="20" readonly> </p> <br> <p>&nbsp&nbsp&nbsp <b><u>Deductions: </u></b></p> <p> PFF: &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp& nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <input type="text" name="pf" maxlength="4" size="20" readonly> </p> <p> Income Tax: &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp& nbsp&nbsp&nbsp <input type="text" name="itax" maxlength="4" size="20" readonly> </p> <br> </form> </body> </html>
OUTPUT:
7. Create a HTML form which displays different validation in address form using java script.
<html> <head> <h2><center> ADDRESS VERIFICATION</center></h2> <script type="text/JavaScript"> var a,r,i; function verifyData() { a=0; r=""; for(i=0;i<6;i++)
{ if(document.forms[0].elements[i].value=="") {a=1; r=r+""+document.forms[0].elements[i].name+";"; } else if((i>3)&&(a==0)) { alert("All textBoxes are filled,Thank you!"); }} for(i=0;i<6;i++) { if(document.forms[0].elements[i].value=="") { alert("please fill in the following textboxes:"+r); document.forms[0].elements[i].focus(); break; } } } </script> </head> <body> <form name="AddressForm"> First Name:<input type="text" name="first name" /><br><br> Last Name:<input type="text" name="Last name" /><br><br> City/Town:<input type="text" name="cty" /><br><br> District:<input type="text" name="Dstr" /><br><br> State:<input type="text" name="state" /><br><br> Zip Code:<input type="text" name="zip" /><br><br> <input type="button" value="Submit" onClick="verifyData()"/> <input type="reset" name="abc" value="Reset"/> </form> </body> </html>
OUTPUT:
8. Write a script which will take name as an input from user and display greeting message to the user according to the time of the day . If time is less than or equal to 12PM then GOOD MORNING with username If time is between12PM to 3PM then GOOD AFTERNOON with username And if time is grater than 3PM then GOOD EVENING with username
<html> <head> <script type="application/javascript"> function status() { var today=new Date(); var name=document.getElementById("myname").value; if(today.getHours()<=12) { alert("Good morning "+name);} else if(today.getHours()>12 && today.getHours()<15) { alert("good after noon "+name);}
else { alert("good evening "+name); } } </script> </head> <body> <input type="text" id="myname" value="enter your name" /> <input type="button" onclick="status();" value="greet" /> </body> </html> OUTPUT:
9. Create a HTML form with the use of different pseudo elements &classes of cascading Style sheets.
<html><head> <title>Different types of psuedo classes and elements</title> <h2> <center> PSEUDO ELEMENTS </center></h2> <style type="text/CSS"> ol>li:first-child{color:pink;} ul>li:last-child{color:green;} a:link {color:#FF0000;} /* unvisited link */ a:visited {color:#00FF00;} /* visited link */ a:hover {color:#FF00FF;} /* mouse over link */ a:active {color:#0000FF;} /* selected link */ p:first-letter{color:red;font-size:300% ;} h3:after { content:"- bciit"; background-color:yellow; color:red; font-weight:bold;} h4:before { content:" Hello"; background-color:orange; color:red; font-weight:bold;} </style></head><body> <h5><p>PSEUDO CLASSES<p></h5> <ol> <li> Good Morning</li> <li> have a nice day</li> </ol> <ul> <li>This is CSS pseudo classes</li> <li>This is the last child</li> </ul> <p> Ashish is my name</p> <h3> I am pursuing MCA from</h3> <h2>Bciit is approved by IP University</h2> <h4>Friends,How are you doing?</h4> <a href="hello.html">visited</a><br><br> <a href="hello.html">active</a><br><br> <a href="hello.html">hover</a><br><br> <a href="hello.html">link</a><br><br> </body></html>
10. Create a DHTML script in order to change visibility of different images. <html> <body> <script language= "javascript"> function everyone_mouseout() { text1.style.visibility="visible"; sunset.style.visibility="visible"; text2.style.visibility="visible"; waterlilies.style.visibility="visible"; } function sunset_mouseover() { text1.style.visibility="visible"; sunset.style.visibility="visible"; text2.style.visibility="hidden"; waterlilies.style.visibility="hidden"; } function waterlilies_mouseover() { text1.style.visibility="hidden"; sunset.style.visibility="hidden"; text2.style.visibility="visible"; waterlilies.style.visibility="visible"; } </script>
<div style = "visibility : visible; text-align: center" OnMouseover="sunset_mouseover();" OnMouseout="everyone_mouseout();"> <span id= "text1" style= "color:blue; font-family= "sans-serif;"> how are you today? </span> <p> <img id ="sunset" src= "Penguins.jpg" height="200" width = "200"/> </div> <div style = "visibility :visible; text-align: center" OnMouseover="waterlilies_mouseover();" OnMouseout="everyone_mouseout();"> <span id= "text2" style= "color:green; font-family= "sans-serif;"> good night... </span> <p> <img id ="waterlilies" src= "Desert.jpg" height="200" width = "200"/> </div> </body> </html>
OUTPUT: When mouse out both the figures are visible.
When mouse on figure 1 then only figure 1 visible
When mouse on figure 2 then only figure 2 visible
12. Create a website for Employee Registration and put the right validations on the forms.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!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> <form id="form1" runat="server"> <center id="Panel2" style="height: 25px">EMPLOYEE REGISTRATION FORM <br />           </center>                            &n bsp;             &nbs p;                             &n bsp;             &nbs p;                           &n bsp;             &nbs p;                                     &n bsp;             &nbs p;                      </head> <body> <div> <asp:Panel ID="Panel1" runat="server" Direction="LeftToRight" HorizontalAlign="Left" Width="566px" BorderStyle="Groove"> A. PERSONAL INFORMATION <hr /> <br /> Name             &nb sp;       <asp:TextBox ID="TextBox1" runat="server" Width="168px"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="TextBox1" ErrorMessage="Name required"></asp:RequiredFieldValidator> <br /> Surname                  <asp:TextBox ID="TextBox2" runat="server" Width="166px"></asp:TextBox> <br /> Father's Name        <asp:TextBox ID="TextBox3" runat="server" Width="164px" ></asp:TextBox> <br /> Mother's Name      <asp:TextBox ID="TextBox4" runat="server" Width="165px"></asp:TextBox> <br /> DOB             &nb sp;        <asp:TextBox ID="TextBox5" runat="server" Width="160px"></asp:TextBox> <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="TextBox5" ErrorMessage="Birth Date Mandatory"></asp:RequiredFieldValidator> <br /> Sex              <asp:RadioButtonList ID="RadioButtonList1" runat="server"> <asp:ListItem>Male</asp:ListItem> <asp:ListItem>Female</asp:ListItem> </asp:RadioButtonList> Marital Status         <asp:DropDownList ID="DropDownList1" runat="server" Width="95px"> <asp:ListItem>Married</asp:ListItem> <asp:ListItem>Unmarried</asp:ListItem> <asp:ListItem>Divorsed</asp:ListItem> </asp:DropDownList>     <br /> Nationality             <asp:TextBox ID="TextBox6" runat="server" Width="160px"></asp:TextBox> <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="TextBox6" ErrorMessage="Nationality required"></asp:RequiredFieldValidator> <br /> Blood Group
<asp:DropDownList ID="DropDownList2" runat="server" Width="85px"> <asp:ListItem>O+</asp:ListItem> <asp:ListItem>O-</asp:ListItem> <asp:ListItem>A+</asp:ListItem> <asp:ListItem>A-</asp:ListItem> <asp:ListItem>B+</asp:ListItem> <asp:ListItem>B-</asp:ListItem> <asp:ListItem>AB+</asp:ListItem> <asp:ListItem>AB-</asp:ListItem> </asp:DropDownList> <br /> </asp:Panel> </div><p> </p> <asp:Panel ID="Panel2" runat="server" BorderStyle="Groove" Width="537px" Height="465px"> B. CONTACT INFORMATION            <hr /> <br /> Home Address      <asp:TextBox ID="TextBox7" runat="server" Height="40px" Width="231px"></asp:TextBox> <br /> Phone:       Res:      <asp:TextBox ID="TextBox8" runat="server" Width="197px"></asp:TextBox> <br />               &n bsp; Mob:    <asp:TextBox ID="TextBox9" runat="server" Width="200px"></asp:TextBox> <br /> Email:             &nbs p;     <asp:TextBox ID="TextBox10" runat="server" Width="200px"></asp:TextBox><hr /> <br /> <br /> C. PROFESSIONAL INFORMATION <hr /> <br /> Profession              <asp:TextBox ID="TextBox11" runat="server" Width="206px"></asp:TextBox> <br /> Experiance             <asp:TextBox ID="TextBox12" runat="server" Width="152px"></asp:TextBox>
Years<br /> School             &n bsp;     <asp:TextBox ID="TextBox13" runat="server" Width="202px"></asp:TextBox> <br /> Department            <asp:TextBox ID="TextBox14" runat="server" Width="198px"></asp:TextBox> <br /> Hired Department <asp:TextBox ID="TextBox15" runat="server" Width="199px"></asp:TextBox> <br /> Hiring Date            <asp:TextBox ID="TextBox16" runat="server" Width="196px"></asp:TextBox> <br /><br /> </asp:Panel> <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Submit" />               <asp:Button ID="Button2" runat="server" Text="Reset" /> <br /> <br /> <br /> <asp:ValidationSummary ID="ValidationSummary1" runat="server" HeaderText="Errors:" /> <br /> </form></body></html> OUTPUT:

WT File

Transféré par

Informations du document

Titre original

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

WT File

Transféré par

Droits d'auteur :

Formats disponibles

Practical File (Web Technology)

Guide: Submitted by: Miss.Yogita Negi

Name : Ashish Verma Semester: 4th Semester Roll No-47

Banarsidas Chandiwala Institute of Information Technology, New Delhi - 110019

OUTPUT: When mouse out both the figures are visible.

When mouse on figure 1 then only figure 1 visible

When mouse on figure 2 then only figure 2 visible

Vous aimerez peut-être aussi