{
var x=document.forms["myForm"]["email"].value;
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
{
alert("Not a valid e-mail address");
return false;
}
}
The function above could be called when a form is submitted:
Example
<form name="myForm" action="demo_form.asp" onsubmit="return validateForm();"
method="post">
Email: <input type="text" name="email">
<input type="submit" value="Submit">
</form>
Procedure: Question :-
1. Declare the script tag as text/javascript in the beginning of the <body> of html program 2. Declare function toTop()
3. Prepare the CSS Document having style sheet for paragraph. 4. Declare different paragraph id.
Practice Exercise:
S.No. Query statement
1 Modify the above document so that when a paragraph is moved from the top stacking position, it returns to its original position rather than to the bottom
ACCEPTANCE CRITERIA
For the acceptance of your program keep in mind following set of points that you have to cover while developing a program and record book:-
Acceptance Points Remarks
Web page design
Web page must be designed in proper way by keeping in mind all the correct syntax of mark up language
Correct implementation HTML,CSS, XHTML code must implemented
correctly
Report Book
It consists of following sections:
Problem Statement Lab Exercise 5.
Observation after each practice exercise
POST LAB ASSIGNMENT
Create a XHTML web page for your personal profile which consists of your personal detail and academic detail validate that web page using java script.
REFERENCES
Bibliography:
HTML and XML complete reference.
Websites:
www.w3schools.com
FAQ’S
What is Java Script and why we need this?
Demonstrate java script document writing?
Demonstrate java script looping?
Demonstrate java script if…..else?
Demonstrate java script pop up box?
LAB -9
PROBLEM STATEMENT
On completion of Lab 9 student shall be able to:
Design basic html and CSS document.
Develop XHTML web page containing XML java script with event handler.
THEORY
Introduction to XML
XML was designed to transport and store data. HTML was designed to display data.
What You Should Already Know
Before you continue you should have a basic understanding of the following:
HTML
JavaScript
What is XML? XML stands for EXtensible Markup Language
XML is a markup language much like HTML
XML was designed to carry data, not to display data
XML tags are not predefined. You must define your own tags
XML is designed to be self-descriptive
XML is a W3C Recommendation
To Design an XML document to store information about a student in an engineering college affiliated to CSVTU. The information must include RollNo, Name, Name of the College, Branch, Year of Joining, and e-mail id. Make up sample data for 5 students. Create a CSS style sheet and use it to display the document.
The Difference Between XML and HTML
XML is not a replacement for HTML.
XML and HTML were designed with different goals:
XML was designed to transport and store data, with focus on what data is
HTML was designed to display data, with focus on how data looks HTML is about displaying information, while XML is about carrying information.
XML Does Not DO Anything
Maybe it is a little hard to understand, but XML does not DO anything. XML was created to structure, store, and transport information.
The following example is a note to Tove, from Jani, stored as XML: <note>
<to>Tove</to> <from>Jani</from>
<heading>Reminder</heading>
<body>Don't forget me this weekend!</body> </note>
The note above is quite self descriptive. It has sender and receiver information, it also has a heading and a message body.
But still, this XML document does not DO anything. It is just information wrapped in tags. Someone must write a piece of software to send, receive or display it.
With XML You Invent Your Own Tags
The tags in the example above (like <to> and <from>) are not defined in any XML standard. These tags are "invented" by the author of the XML document.
That is because the XML language has no predefined tags.
The tags used in HTML are predefined. HTML documents can only use tags defined in the HTML standard (like <p>, <h1>, etc.).
XML is Not a Replacement for HTML XML is a complement to HTML.
It is important to understand that XML is not a replacement for HTML. In most web applications, XML is used to transport data, while HTML is used to format and display the data.
My best description of XML is this:
XML is a software- and hardware-independent tool for carrying information.
XML is a W3C Recommendation
XML became a W3C Recommendation on February 10, 1998.
To read more about the XML activities at W3C, please read our W3C Tutorial.
XML is Everywhere
XML is now as important for the Web as HTML was to the foundation of the Web. XML is the most common tool for data transmissions between all sorts of applications.
Reacting to Events
A JavaScript can be executed when an event occurs, like when a user clicks on an HTML element. To execute code when a user clicks on an element, add JavaScript code to an HTML event attribute: onclick=JavaScript
Examples of HTML events:
When a user clicks the mouse
When a web page has loaded
When an image has been loaded
When the mouse moves over an element
When an input field is changed
In this example, the content of the <h1> element is changed when a user clicks on it: <!DOCTYPE html>
<html> <body>
<h1 onclick="this.innerHTML='Ooops!'">Click on this text!</h1> </body>
</html>
In this example, a function is called from the event handler:
Example <!DOCTYPE html> <html> <head> <script> function changetext(id) { id.innerHTML="Ooops!"; } </script> </head> <body>
<h1 onclick="changetext(this)">Click on this text!</h1> </body>
</html>
JavaScript Form Validation
JavaScript can be used to validate data in HTML forms before sending off the content to
a server.
Form data that typically are checked by a JavaScript could be:
has the user left required fields empty?
has the user entered a valid e-mail address?
has the user entered a valid date?