Unit IV Notes
Unit IV Notes
COM 2013
UNIT IV
Representing Web Data: XML-Documents and Vocabularies-Versions and Declaration Namespaces JavaScript and XML: Ajax-DOM based XML processing Event-oriented Parsing: SAX-Transforming XML Documents-Selecting XML Data: PATH-Template- based Transformations: XSLT-Displaying XML Documents in Browsers-Case Study- Related Technologies. Separating Programming and Presentation: JSP Technology Introduction-JSP and Servlets-Running JSP Applications Basic JSP-JavaBeans Classes and JSP-Tag Libraries and FilesSupport for the Model-View-Controller Paradigm-Case Study-Related Technologies. Representing Web Data: XML XML XML stands for eXtensible Markup Language, developed by W3C in 1996. XML 1.0 was officially adopted as a W3C recommendation in 1998. XML was designed to carry data, not to display data. XML is designed to be self-descriptive. XML is a subset of SGML that can define your own tags. A Meta Language and tags describe the content. XML Supports CSS, XSL, DOM. The Difference between XML and HTML 1. HTML is about displaying information, where as XML is about carrying information. In other words, XML was created to structure, store, and transport information. HTML was designed to display the data. 2. Using XML, we can create own tags where as in HTML it is not possible instead it offers several built in tags. 3. XML is platform independent neutral and language independent. 4. XML tags and attribute names are case sensitive where as in HTML it is not. 5. XML attribute values must be single or double quoted where as in HTML it is not compulsory 6. XML elements must be properly nested 7. All XML elements must have a closing tag 8. XML is used to create new internet languages. Here are some examples: WSDL for describing available web services WAP and WML as markup languages for handheld devices RSS languages for news feeds RDF and OWL for describing resources and ontology SMIL for describing multimedia for the web
WWW.VIDYARTHIPLUS.COM 2013
Well Formed XML Documents XML with correct syntax is "Well Formed" XML. XML validated against a DTD is "Valid" XML.
A "Well Formed" XML document must have the following correct XML syntax: XML documents must have a root element XML elements must have a closing tag XML tags are case sensitive XML elements must be properly nested XML attribute values must be quoted
Example for XML Document <?xml version="1.0" encoding="ISO-8859-1"?> <note> <to>Tove</to> <from>Jani</from> <heading>Reminder</heading> <body>Don't forget me! </body> </note> Xml document begins with XML declaration statement: <? xml version="1.0" encoding="ISO8859-1"?> . The next line describes the root element of the document: <note>. This element is "the parent" of all other elements. The next 4 lines describe 4 child elements of the root: to, from, heading, and body. And finally the last line defines the end of the root element : < /note> XML Element An XML element is everything from (including) the element's start tag to (including) the element's end tag. An element can contain: other elements text attributes Or a mix of all of the above...
WWW.VIDYARTHIPLUS.COM 2013
element and attribute names element content Semantics of elements and attributes
Some of the xml vocabularies are XHTML, RSS, XSL, DTD, and Schema XML DTD Document Type Definition purpose is to define the structure of an XML document. It defines the structure with a list of defined elements in the xml document. <!DOCTYPE note [ <!ELEMENT note (to,from,heading,body)> <!ELEMENT to (#PCDATA)> <!ELEMENT from (#PCDATA)> <!ELEMENT heading (#PCDATA)> <!ELEMENT body (#PCDATA)> ]> Where PCDATA refers parsed character data. In the above xml document the elements to, from, heading, body carries some text, so that, these elements are declared to carry text in DTD file. This definition file is stored with .dtd extension. XML Schema It is an alternative to DTD to define the structure of an XML document. <xs:element name="note"> <xs:complexType> <xs:sequence> <xs:element name="to" type="xs:string"/> <xs:element name="from" type="xs:string"/> <xs:element name="heading" type="xs:string"/> <xs:element name="body" type="xs:string"/> </xs:sequence> </xs:complexType> </xs:element> This definition file is stored with .xsl extension. XML DTD vs XML Schema
WWW.VIDYARTHIPLUS.COM 2013
The schema has more advantages over DTD. A DTD can have two types of data in it, namely the CDATA and the PCDATA. The CDATA is not parsed by the parser whereas the PCDATA is parsed. In a schema you can have primitive data types and custom data types like you have used in programming. XML Parsers An XML parser converts an XML document into an XML DOM object - which can then be manipulated with a JavaScript. Two types of XML parsers: Validating Parser It requires document type declaration It generates error if document does not Conform with DTD and Meet XML validity constraints Non-validating Parser It checks well-formedness for xml document It can ignore external DTD
XML Namespaces It is a collection of element and attributes names associated with an XML vocabulary. XML Namespaces provide a method to avoid element name conflicts. XML document 1 <table> <tr> <td>Apples</td> <td>Bananas</td> </tr> </table> XML document2 <table> <name> Coffee Table</name> <width>80</width> <length>120</length> </table>
WWW.VIDYARTHIPLUS.COM 2013
If these XML fragments were added together, there would be a name conflict. Both contain a <table> element, but the elements have different content and meaning. Such name conflicts in XML can easily be avoided using a name prefix as shown below: <h:table> <h:tr> <h:td>Apples</h:td> <h:td>Bananas</h:td> </h:tr> </h:table> <f:table> <f:name>African Coffee Table</f:name> <f:width>80</f:width> <f:length>120</f:length> </f:table> When using prefixes in XML, a so-called namespace for the prefix must be defined. The namespace is defined by the xmlns attribute in the start tag of an element. The namespace declaration has the following syntax. xmlns:prefix="URI" For example, <h:table xmlns:h="http://www.w3.org/table"> <h:tr> <h:td>Apples</h:td> <h:td>Bananas</h:td> </h:tr> </h:table> <f:table xmlns:f="http://www.w3.org/furniture"> <f:name>African Coffee Table</f:name> <f:width>80</f:width> <f:length>120</f:length> </f:table>
Default namespace Default xml namespace uri for elements of a document is xmlns:http://www.w3.org/1999/xhtml
WWW.VIDYARTHIPLUS.COM 2013
RSS RSS stands for Rich Site Summary RSS is a format for delivering regularly changing web content. Many news-related sites and other online publishers syndicate their content as an RSS Feed to whoever wants it. RSS allows you to syndicate your site content RSS defines an easy way to share and view headlines and content RSS files can be automatically updated RSS allows personalized views for different sites RSS is written in XML With RSS it is possible to distribute up-to-date web content from one web site to thousands of other web sites around the world. RSS allows fast browsing for news and updates. RSS was designed to show selected data. Distributing your content using RSS will involve creating one file that contains your content. This file will reside on your server to enable other web sites to display your channel. You can update your channel simply by updating your file. Without RSS, users will have to check your site daily for new updates. This may be too timeconsuming for many users. With an RSS feed, they can check your site faster using an RSS aggregator (a site or program that gathers and sorts out RSS feeds) since RSS data is small and fast-loading RSS is useful for web sites that are updated frequently, like: 1. 2. 3. 4. News sites - Lists news with title, date and descriptions Companies - Lists news and new products Calendars - Lists upcoming events and important days Site changes - Lists changed pages or new pages
Creating an RSS File Your first step will be to identify your file. To do this, place the following code at the top of your text file. <?xml version="1.0"?> <rss version="0.91"> Your next step will be to create your channel header. The "channel" tag indicates that you are beginning a new channel.
WWW.VIDYARTHIPLUS.COM 2013
<channel> <title>Web-Source.net Syndication</title> <link>http://www.web-source.net</link> <description>Web Development article syndication feeds!</description> <language>en-us</language> The "title" tag indicates the name of your channel. The "link" tag will contain a link to your web site. The "description" tag describes your channel and the "language" tag indicates that you're writing in US English. Now, you're ready to create your headlines. Each new "item" tag represents a new topic. <item> <title> Creating A Customized Marquee </title> <link>http://www.example.com/tips.htm</link> <description> Learn how to create a customized marquee for your web </description> </item> Your final step will be to close your channel by adding the following tags: </channel> </rss> Save your new file with .rss file extension and upload it to your server. And now, you're ready to share your content. JavaScript and XML: AJAX AJAX: AJAX stands for Asynchronous JavaScript and XML AJAX allows web pages to be updated asynchronously by exchanging small amounts of data with the server behind the scenes. This means that it is possible to update parts of a web page, without reloading the whole page. Using Ajax, o o o Update a web page with new data without reloading the page Request data from a server after the page has loaded Receive data from a server after the page has loaded
WWW.VIDYARTHIPLUS.COM 2013
o Send data to a server in the background AJAX allows updating parts of a web page, without reloading the whole page.
With Ajax, web applications can also retrieve data from the server asynchronously in the background without interfering with the display and behavior of the existing page. - Ajax is combination of o HTML o XML o CSS o JavaScript o JavaScript DOM o XMLHttpRequest in asynchronous mode 1. Asynchronous This means that when you send a request, you wait for the response to come back, but are free to do other things while you wait. The response probably wont come back immediately, so you set up a function that will wait for the response to be sent back by the server, and react to it once that happens. 2. JavaScript JavaScript is used to make a request to the server. Once the response is returned by the server, you will generally use some more JavaScript to modify the current pages document object model in some way to show the user that the submission went through successfully. 3. XML The data that you receive back from the server will often be packaged up as a snippet of XML, so that it can be easily processed with JavaScript. This data can be anything you want, and as long as you want. How AJAX works?
XMLHttpRequest - Constructor for other host objects allow a JavaScript program to send an HTTP request to a server and receive back a response containing an XML document. The following program illustrates the use of XMLHttpRequest.
WWW.VIDYARTHIPLUS.COM 2013
Example The following AJAX application above contains one div section and one button. The div section will be used to display information returned from a server. The button calls a function named loadXMLDoc(), if it is clicked: <html> <head> <script type="text/javascript"> function dataData() { var xmlhttp=new XMLHttpRequest(); // create XMLHttpRequest to exchange data with server var obj= getElementById("myDiv"); xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { obj=xmlhttp.responseText; } } xmlhttp.open("GET",data.txt, true); To send a request to server xmlhttp.send(); } </script> </head> <body><form> <div id="myDiv">Let AJAX change this text</div> <input type="button" value=Change Content onclick=getData(); /> </form></body> </html> The AJAX application above contains one div section and one button. The div section will be used to display information returned from a server. Button calls a function named getData(), if it is clicked. The script section contains the getData() function. The AJAX script presents inside the getData() function. When a request is sent to server, onreadystatechange event is triggered. The readystate property holds the status of the XMLHttpRequest. The readystate=4 means request is finished and response is ready where as status=200 means OK. When the button is clicked, the content available in the file data.txt will be placed inside the <div> tag. The existing content Let AJAX change this text will be replaced with data.txt content
WWW.VIDYARTHIPLUS.COM 2013
XML DOM Document Object Model is for defining the standard for accessing and manipulating XML documents. XML DOM is used for Loading the xml document Accessing the xml document Deleting the elements of xml document Changing the elements of xml document According to the DOM, everything in an XML document is a node. It considers
The entire document is a document node Every XML element is an element node The text in the XML elements are text nodes Every attribute is an attribute node Comments are comment nodes
DOM Levels
Level 1 Core: W3C Recommendation, October 1998 o It has feature for primitive navigation and manipulation of XML trees o other Level 1 features are: All HTML features Level 2 Core: W3C Recommendation, November 2000 o It adds Namespace support and minor new features o other Level 2 features are: Events, Views, Style, Traversal and Range Level 3 Core: W3C Working Draft, April 2002 o It supports: Schemas, XPath, XSL, XSLT
We can access and parse the XML document in two ways: o o Parsing using DOM (tree based) Parsing using SAX (Event based)
Parsing the XML doc. using DOM methods and properties are called as tree based approach whereas using SAX (Simple Api for Xml) methods and properties are called as event based approach. DOM based XML Parsing:(tree based) JAXP is a tool, stands for Java Api for Xml Processing, used for accessing and manipulating xml document in a tree based manner. In this approach, to access XML document, the document object model implementation is defined in the following packages:
WWW.VIDYARTHIPLUS.COM 2013
javax.xml.parsers org.w3c.dom
The following DOM java Classes are necessary to process the XML document: DocumentBuilderFactory class creates the instance of DocumentBuilder. DocumentBuilder produces a Document (a DOM) that conforms to the DOM specification
The following methods and properties are necessary to process the XML document: Property nodeName nodeValue parentNode childNodes attributes Method getElementByTagName(name) appendChild(node) removeChild(node) To Count the Elements in a XML File This program takes a file name from the console and checks its availability. If the file exists then a parser is created using Document Builder. This object parses the given XML document. It searches the specified element name and counts its occurrence in the xml file. If the given element doesn't exist it displays the '0' element. Step 1: Create an xml file: Employee-Detail.xml <?xml version = "1.0" ?> <Employee-Detail> <Employee> <Emp_Id> E-001 </Emp_Id> <Emp_Name> Vinod </Emp_Name> <Emp_E-mail> [email protected] </Emp_E-mail> </Employee> <Employee> <Emp_Id> E-002 </Emp_Id> <Emp_Name> Arun </Emp_Name> Meaning Finding the name of the node Obtaining value of the node To get parnet node Obtain child nodes For getting the attributes values Meaning To access the element by specifying its name To insert a child node To remove existing child node
WWW.VIDYARTHIPLUS.COM 2013
<Emp_E-mail> [email protected] </Emp_E-mail> </Employee> </Employee-Detail> Step 2: Create a java based dom for counting the number of elements in xml file.
File file = new File(args[0]); // Employee_Detail.xml is a file to be parsed is given as DocumentBuilderFactory factory = DocumentBuilderFactory.newInstance(); DocumentBuilder builder = factory.newDocumentBuilder(); // parser is created Document doc = builder.parse(file); // file is parsed
//input from command prompt
System.out.println("Number of nodes: " + list.getLength()); // counting no. of occurrences }catch (Exception e){ } } }
Output: Number of nodes: 2 The diagram here shows the JAXP APIs to process xml document using the DOM parser:
Event oriented XML Parsing: SAX SAX stands for Simple API for XML
WWW.VIDYARTHIPLUS.COM 2013
SAX provides a mechanism for reading data from an XML document, SAX parsers operate on each piece of the XML document sequentially. It is a kind of event oriented approach for parsing the xml document. An XML tree is not viewed as a data structure, but as a stream of events generated by the parser. The kinds of events are:
the start of the document is encountered the end of the document is encountered the start tag of an element is encountered the end tag of an element is encountered character data is encountered a processing instruction is encountered
Scanning the XML file from start to end, each event invokes a corresponding callback method that the programmer writes. SAX packages javax.xml.parsers: Describing the main classes needed for parsing org.xml.sax: Describing few interfaces for parsing
SAX classes SAXParser Defines the API that wraps an XMLReader implementation class SAXParserFactory Defines a factory API that enables applications to configure and obtain a SAX based parser to parse XML documents ContentHandler Receive notification of the logical content of a document. DTDHandler Receive notification of basic DTD-related events. EntityResolver Basic interface for resolving entities. ErrorHandler Basic interface for SAX error handlers. DefaultHandler Default base class for SAX event handlers.
startDocument() and endDocument() methods called at the start and end of an XML document. startElement() and endElement() methods called at the start and end of a document element.
WWW.VIDYARTHIPLUS.COM 2013
characters() method called with the text contents in between the start and end tags of an XML document element.
At the very first, create an instance of the SAXParserFactory class which generates an instance of the parser. This parser wraps a SAXReader object. When the parser's parse() method is invoked, the reader invokes one of the several callback methods (implemented in the application). These callback methods are defined by the interfaces ContentHandler, ErrorHandler, DTDHandler, and EntityResolver. SAX Example :Selecting XML data Step 1. Create a XML file Create a simple XML file as following <?xml version="1.0"?> <company> <staff> <firstname>Ram</firstname> <salary>100000</salary> </staff> <staff> <firstname>Kumar</firstname> <salary>200000</salary> </staff> </company>
WWW.VIDYARTHIPLUS.COM 2013
2. Create a Java file. Use SAX parser to parse the XML file. import javax.xml.parsers.SAXParser; import javax.xml.parsers.SAXParserFactory; import org.xml.sax.SAXException; import org.xml.sax.helpers.DefaultHandler; public class ReadXMLFileSAX { public static void main(String argv[]) { try { SAXParserFactory factory = SAXParserFactory.newInstance(); SAXParser saxParser = factory.newSAXParser(); DefaultHandler handler = new DefaultHandler() { boolean bfname = false; boolean bsalary = false; public void startElement(String uri, String localName, attributes) throws SAXException { String qName, Attributes
System.out.println("Start Element :" + qName); if (qName.equals("FIRSTNAME")) { bfname = true; if (qName.equals("SALARY")) { bsalary = true; }
public void endElement(String uri, String localName, String qName) throws SAXException { } public void characters(char ch[], int start, int length) throws SAXException { if (bfname) { System.out.println("First Name : " + new String(ch, start, length));
WWW.VIDYARTHIPLUS.COM 2013
} bfname = false;
Result Start Element :company Start Element :staff Start Element :firstname First Name : Ram End Element :firstname Start Element :salary Salary : 100000 End Element :salary End Element :staff Start Element :staff Start Element :firstname First Name : Kumar End Element :firstname Start Element :salary Salary : 200000 End Element :salary End Element :staff End Element :company Differences between SAX and DOM SAX Event based model Serial access Low memory usage Used to process parts of the document DOM Tree data structure Random access High memory usage Used to edit the document
WWW.VIDYARTHIPLUS.COM 2013
Used to process the document only once Parses node by node Doesnt store the XML in memory We cant insert or delete a node Top to bottom traversing SAX is a Simple API for XML Packages required to import import javax.xml.parsers.*; import org.xml.sax.*; SAX generally runs a little faster than DOM Transforming XML document It is process of extracting one info. From one xml doc. and uses that info to create another xml doc. XSL XSL is stands for eXtensible Style sheet Language which is an xml vocabulary. It contains two types of information: Template data: Which is text that is copied to output xml document with change or no change. XSL markup: which controls transformation process. It uses two namespaces: o o http://www.w3.org/1999/xsl/Transform is the namespace name for xsl namespace http://www.w3.org/1999/xhtml is the xhtml namesapce name Used to process multiple times (document is loaded in memory) Stores the entire XML document into memory before processing Occupies more memory We can insert or delete nodes Traverse in any direction. Document Object Model (DOM) API import javax.xml.parsers.*; import javax.xml.parsers.DocumentBuilder; import javax.xml.parsers.DocumentBuilderFactory; DOM is slow rather than SAX
WWW.VIDYARTHIPLUS.COM 2013
XSLT XSL Transformations (XSLT) is a language to specify transformations of XML documents. A transformation expressed in XSLT describes rules for transforming a source tree into a result tree XPATH- is used to find information in an XML document. It navigates through elements and attributes in XML documents. XSL-FO is a XSL Formatter an xml vocabulary for defining style properties of xml document. To transform xml document the following things are required: a. Source xml document b. Xslt style sheet that defines the information of source xml program to be transformed c. Xslt processor that performs transformation The following program illustrates that.
The JAXP is a tool which is used as XSLT processor. The XSLT processor receives xslt and xml program as its input and generates another xml program as its output where we can see the content retrieved from source xml program The JAXP API has in the following packages for xml transformations: Package javax.xml.transform Description Defines the TransformerFactory and Transformer classes. These classes are used to get a object for doing transformations. Defines classes used to create input and output objects from a DOM. Defines classes used to create input from a SAX parser and output objects from a SAX event handler.
javax.xml.transform.dom
javax.xml.transform.sax
WWW.VIDYARTHIPLUS.COM 2013
javax.xml.transform.stream Defines classes used to create input and output objects from an I/O stream. You can refer lab experiment also
Step 1. Create an XML file and save as myXML.xml The code for the emp.xml file is given below: <?xml version = "1.0" ? > <Employee-Detail> <Employee> <Emp_Id> E-001 </Emp_Id> <Emp_Name> Nisha </Emp_Name> <Emp_E-mail> [email protected] </Emp_E-mail> </Employee> <Employee> <Emp_Id> E-002 </Emp_Id> <Emp_Name> Amit</Emp_Name> <Emp_E-mail> [email protected] </Emp_E-mail> </Employee> </Employee-Detail> Step 2: Create an XSLT Stylesheet and save as myXSL.xsl extension <?xml version="1.0" ?> <xsl:transform xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"> <xsl:template match="/"> <html><head><title> XSL for Transforamtion </title> <body><p> <xsl:for-each select="Employee"> <xsl:value-of select="child::Emp_Id"/> <xsl:value-of select="child::Emp_Name"/> <xsl:value-of select="child::Emp_E-mail"/> </xsl:for-each> </p></body></html> </xsl:template> </xsl:stylesheet> Step 3: Create XML Transformer program in java and give input both .xml and .xsl file
WWW.VIDYARTHIPLUS.COM 2013
import javax.xml.transform.Transformer; import javax.xml.transform.TransformerFactory; import javax.xml.transform.stream.StreamSource; import javax.xml.transform.stream.StreamResult; import javax.xml.transform.Source; import javax.xml.transform.Result; import javax.xml.transform.OutputKeys; public class XMLwithXSLT { public static void main(String[] args) throws Exception { Source source = new StreamSource("myXML.xml"); Source xsl = new StreamSource("myXSL.xsl"); TransformerFactory factory = TransformerFactory.newInstance(); Transformer transformer = factory.newTransformer(xsl); new StreamResult(System.out); }
The following figure illustrates how the xslt transformer constructs the source tree from source xml document and by using that with the help of xsl program how the result tree is constructed.
Result tree is constructed base on the following definitions given in xsl style sheet <xsl:template match="/">
WWW.VIDYARTHIPLUS.COM 2013
<html><head><title> XSL for Transforamtion </title> <body><p> <xsl:for-each select="Employee"> <xsl:value-of select="child::Emp_Id"/> <xsl:value-of select="child::Emp_Name"/> <xsl:value-of select="child::Emp_E-mail"/> </xsl:for-each> </p></body></html> </xsl:template> XPATH Is the syntax for specifying a collection of elements on other info contained within xml doc. XPATH expression will be applied to parse the xml doc. which constructs a tree like representation of xml doc. similar to DOM tree. The root of the XPath parse tree is document Location Paths <xsl:template match="/"> which represents the XPath document root. An XPath expression such as this represents one or more nodes within XPath parse tree is known as location path. This location path consists a location step Location step has two parts: An axis name followed by (::) Node test
Axis name specifies the direction to which we can search a node Node test specifies an element name selected for transformation Axis name: The following are several axis names uses to search a particular element in the xml doc.
WWW.VIDYARTHIPLUS.COM 2013
Predicate: XPath uses some predicate which constructs the node test. Predicate can be either child::<element name> (Or) Attribute::<value> Absolute and Relative Location Path A location path can consists of several location steps separated by / character. For example,
Displaying XML in the browser: (XML+CSS program) XMLuses a processing instruction which is a special xml rag that gas syntax similar to that of xml declaration. The tag begins with <? and ends with ?>. Each processing instruction begins with the name as the target of the processing instruction. The tag xml-stylesheet is used to link the xml document with the css file. Helloworld.xml
WWW.VIDYARTHIPLUS.COM 2013
<? xml version=1.0 encoding=UTF-8 ?> <? xml-stylesheet type=text/html href=helloworld.css ?> <message> Hello World! </message> Hellowworld.css message { display:block; margin: 8pt; font-weight=bold;
} When xml doc. Helloworld.xml is executed, the xml doc is linked to the specified Helloworld.css file and displays the output after applying css specifications. Separating Programming and Presentation: JSP Technology What is JSP?
JSP Stands for "Java Server Pages". Using "JSP" we can use both, static HTML with dynamically-generated HTML. Web pages created using CGI programs are mostly static , dynamic part is limited to a few small locations. But using CGI and servlet , you can generate entire page through one program. Using JSP, you can built two parts separately. JSP is the product of Sun Microsystems Inc.JSP has more advance features than Servlet . JSP separates the presentation logic from the business logic ,provide facility to developers to work separately without any trouble.JSP have the properties of Cold fusion and ASP and hence provide the flexibility to embed the business logic efficiently within the HTML content (presentation logic).
Advantages of JSP: JSP is useful for server side programming JSP are translated and compiled into JAVA servlets but are easier to develop than JAVA servlets. JSP uses simplified scripting language based syntax for embedding HTML into JSP. JSP containers provide easy way for accessing standard objects and actions. JSP reaps all the benefits provided by JAVA servlets and web container environment, but they have an added advantage of being simpler and more natural program for web enabling enterprise developer JSP use HTTP as default request /response communication paradigm and thus make JSP ideal as Web Enabling Technology.
WWW.VIDYARTHIPLUS.COM 2013
JSP and Servlets JSP documents are not executed directly When a JSP document is first visited, 1. first the server translates the JSP document to a servlet 2. Compiles the servlet Then the servlet is executed If any error occurs while executing, the exception will occur which gives the information for the servlet not for the JSP A JSP-generated servlet has a _jspService() method rather than doGet() or doPost() This method begins to access the java code by creating a number of implicit objects.
Implicit Objects in JSP JSP Implicit Objects are: Pre-defined variables that can be included in JSP expressions and scriptlets. Implemented from servlet classes and interfaces.
The followings are the implicit objects supported by jsp. OBJECT Out Request Response Session Application Config CLASS JSP writer HttpServletRequest HttpServletRespose HttpSession ServletContext Sevlet Config
WWW.VIDYARTHIPLUS.COM 2013
Page Object
Difference between servlet and JSP In servlets both the presentation and business logic are place it together where as in jsp both are separated by defining by java beans. Servlet is a java code where HTML code can be embedded whereas in jsp, it is a kind of HTML where java code can be embedded by using special tags. JSP allows creating and using custom tag libraries.
For example, <%@page language=java content Type="text/html" %> // jsp element <html><body> <% out.println(JSP = HTML+JAVA) %> // jsp element Today date is: <% = new Date().toString() %> // jsp element and java method </body> </html> In this code, jsp elements that use java code are merged with HTML code. Scoped Variables Four different types of variable scopes within the JSP page can be used:
Page Scope: Objects stored in page scope can only be retrieved during the processing of that page for a specific request. Request Scope: Objects stored in request scope can be retrieved during the processing of all pages taking part in the processing of a request Session Scope: Object stored in session scope can be retrieved by any pages accessed by a user during a single interactive session with the Web application
WWW.VIDYARTHIPLUS.COM 2013
Application Scope: Object stored in application scope is accessible from all pages and for all users, until the Web application itself is unloaded
Display "Hello JSP" using Jsp expression In this section, We will simply output "Hello JSP" in a web browser using Jsp expression. JSP expressions insert values directly into the output. The syntax to include a JSP expressions in the JSP file is: <%= expression %>.
In JSP page, we can use both, static HTML with dynamically-generated HTML. In this program, we produce output "hello Jsp" using this tag : <%= "Hello World!" %> All the other content except this is simple HTML code. Code of this program:
<html>
</html>
<head><title>Hello World JSP Page.</title></head> <body> <<%= "Hello JSP!" %> </body>
Output : Hello JSP! Web Applications A web application is a collection of resources that are used together to implement some web-based functionality To develop a web applications the following resources are needed: Server side Programming Servlets /JSP,
WWW.VIDYARTHIPLUS.COM 2013
Client side programming : HTML documents, style sheets, XML , images, non servlet java classes etc, Web form validation: JavaScript, non-servlet Java classes, etc. Other resources: Databases: MS-Access, MySQL/SQL Web server: Appache Tiomcat/ Java Web server/ Glass fish, Browser: IE/Netscape/Chrome/FireFox
Running JSP Applications The following section explains the steps you must take to run sample JSP into TomCat The steps involved 1. Preparation 2. Deploy 3. Run 1. Preparation Step 1: Create required jsp flies like ExcelCalculatorJSP.html, and ExcelCalculatorExample.jsp files Step 2. Creare a folder under webapp directory in tomcat installation path eg:C:\Tomcat5.5\webapps\test Step 3. Copy all your JSP files in a folder by name "test". 2. Deploy 1. In the test directory, create two directories named META-INF and WEB-INF. Now you should have a directory structure that looks like this:
2. Create the XML descriptor: Here is the sample XML descriptor you can use to deploy this example. Save this file as web.xml in the WEB-INF directory.
WWW.VIDYARTHIPLUS.COM 2013
<?xml version="1.0" encoding="Cp1252"?> <web-app> <display-name>ExcelCalculatorJSP</display-name> <servlet> <servlet-name>ExcelCalculatorJSP </servlet-name> <display-name>ExcelCalculatorJSP</display-name> <jsp-file>/ExcelCalculatorExample.jsp </jsp-file> </servlet> <session-config> <session-timeout>30</session-timeout> </session-config> </web-app> 3. Create a manifest file: Create a file called Manifest.mf (it can be an empty file) and save it in the META-INF directory. 4. After you finished putting these files on the correct place, your directory structure looks like this:
5. Now you need to add this new JSP to server.xml. Go to the conf directory and open server.xml. 6. Add the following lines at the bottom of server.xml <Context path="/test" docBase="webapps/test" crossContext="true" debug="0" reloadable="true" trusted="false" > </Context> 3. Run 1. Shut down the server by issuing this command: shutdown 2. Re-start server by issuing this command: startup 3. In browser, enter: http://localhost:8080/test/ExcelCalculatorJSP.html Basic JSP JSP page has the following components(contents)
Directives
WWW.VIDYARTHIPLUS.COM 2013
Directives The directives are used to specify the attributes of the JSP page. Also it can be used to import java packages in to the jsp page. For example, <%@ page language=java contentType=text/html %> <% @page import =java.util.* %> Where language=java tells tha the page is contains java code, the code contentType=text/html specifies the MIME type, the code import =java.util.* used to import all the classes of javas utility package into this page. Declarations: Provide a mechanism to define variables and methods. Declarative statements are placed within <%! and %> symbols and always end with a semicolon. Syntax: <%! Declare all the variables here %> For example, <% int a, b %> Scriplets: Consists of valid Java code snippets that are enclosed within <% and %> symbols. The syntax to declare JSP scriptlets to include valid Java code is: <% Java code %> Scriplets can't generate HTML itself. Using "out" variable, it can generate HTML. This variable does not need to be declared. It is already predefined for Scriplets, along with some other variables. The "out" variable is of type "javax.servlet.jsp.JspWriter". For example, <HTML> <BODY> <%
java.util.Date date = new java.util.Date(); %> Hello! The time is now <% out.println( String.valueOf( date )); %>
WWW.VIDYARTHIPLUS.COM 2013
</BODY> </HTML>
Output: Hello! The time is now 12/12/2010 12:10:02 Expression: Insert values directly into the output. The syntax to include a JSP expression in the JSP file is: <%= expression %>. For example, <%= "Hello World!" %> Actions The elements which are used to access the java bean in a jsp page is called jsp action elements. JSP defines the following action elements: Standard action and Custom action JSTL
WWW.VIDYARTHIPLUS.COM 2013
<jsp:useBean> <jsp:setProperty: used to include java bean object used to set the property value for java bean class
<jsp:getProperty> used to get the property of java bean class <jsp:include> used to include response from servlet or jsp when request is being processed for adding specific parameter into the jsp page used to forward current request used to embed java applet used to set the value fo action attribute used to generate XML elements dynamically
Java Bean classes and JSP Java Beans are reusable components. They are used to separate Business logic from the Presentation logic. Internally, a bean is just an instance of a class. JSPs provide three basic tags for working with Beans.
<jsp:useBean id=bean name class=bean class scope = page | request | session |application /> bean name = the name that refers to the bean. Bean class = name of the java class that defines the bean.
<jsp:setProperty name = id property = someProperty value = someValue /> id = the name of the bean as specified in the useBean tag. property = name of the property to be passed to the bean. value = value of that particular property .
An variant for this tag is the property attribute can be replaced by an *. What this does is that it accepts all the form parameters and thus reduces the need for writing multiple setProperty tags.
WWW.VIDYARTHIPLUS.COM 2013
The only consideration is that the form parameter names should be the same as that of the bean property names.
Here the property is the name of the property whose value is to be obtained from the bean. Step 1: Create a java bean public class SampleBean { private String firstName = ""; private String lastName = ""; public void setFirstName(String name) { public void setLastName(String name) { } public String getFullName() { firstName = name; } lastName = name; }
Step 2: Use bean inside the jsp file <HTML> <HEAD> <TITLE>Example: Simple Java Bean</TITLE> <jsp:useBean id="SampleBean" scope="page" class="SampleBean" /> </HEAD> <BODY> <%-- Set bean properties --%> <jsp:setProperty name="SampleBean" property="FirstName" <jsp:setProperty name="SampleBean" property=LastName" <%-- Get bean properties --%> <jsp:getProperty name="SampleBean" property="FullName" /> </BODY> </HTML> JSTL JSTL: JSP Standard Tag Libraries is a collection of JSP custom tags value="Robert" /> value="John" />
WWW.VIDYARTHIPLUS.COM 2013
The goal of JSTL, is to help simplify Java Server Pages page authoring tasks. To achieve this goal, JSTL has provided custom tags for many common JSP page authoring tasks that require scripting statements to manipulate server side dynamic data. JSTL offers tags through 4 functional areas:
core - Basic scripting xml - XML processing fmt - Internationalization of formatting sql - Data base accessing functions for using functions
The following table summarizes these functional areas along with the prefixes used in the jsp pages. Core Area Description Variable support Flow control URL management Miscellaneous Core Flow control Transformation Message formatting SQL Collection length String manipulation Prefix c
XML
fmt sql fn
The <c:set> action provides a tag-based mechanism for creating and setting scoped variables. For example,
WWW.VIDYARTHIPLUS.COM 2013
<c:set var="variable_name" scope="page | request | session | application" value="expression"/> <c:remove> The <c:remove> action is used to delete a scoped variable. For example, <c:remove var="variable_name" scope="page | request | session | application" />
<c:forEach> The <c:forEach> custom tag is used to fetch and display collections of data, typically in the form of a list or sequence of rows in a table. This tag supports two different styles of iteration: <c:forEach var="variable_name" varStatus="name" begin="expression" end="expression" step="expression"> -------------</c:forEach>
The index of the iteration starts at the value of the begin attribute, is incremented by the value of the step attribute, and halts iteration when it exceeds the value of the end attribute. If the step attribute is omitted, the step size defaults to 1. For example, <c:forEach var=i begin=10 end=20 step=2> <c:out value=${i} /> </c:forEach> Output: 10 12 14 16 18 20 <c:if>: <c:if> evaluates a single test expression and then processes its body content only if that expression evaluates to true. If not, the tag's body content is ignored. Syntax for the <c:if> conditional action: <c:if test="expression" var="name" scope="scope"> ------------</c:if>
WWW.VIDYARTHIPLUS.COM 2013
For example, <c:set var=fruit /> <c:if test=${fruit==Apple} /> I like <c:out value=${fruit}/> very much! </c:if> <c:set var=fruit /> <c:if test=${fruit==Mango} /> I like <c:out value=${fruit}/> very much! </c:if> <c:choose>: <c:choose> is provided for cases in which mutually exclusive tests are required to determine what content should be displayed. Syntax for the <c:choose> action: <c:choose> <c:when test="expression"> -----------</c:when> ------------<c:otherwise> ------------</c:otherwise> </c:choose> For example, <c:set var=fruit /> <c:choose> <c:when test=${fruit==Apple}> I like <c:out value=${fruit}/> much </c:when> <c:when test=${fruit==Mango} > I like <c:out value=${fruit}/> very much </c:when> <c:otherwise> I do not like <c:out value=${fruit}/> </c:otherwise>
WWW.VIDYARTHIPLUS.COM 2013
</c:choose> <c:out> The <c:out> tag evaluates the expression specified by its value attribute, then prints the result. If the optional default attribute is specified, this action will instead print its value if the value attribute's expression evaluates either to null or an empty String. <c:out value="expression" default="expression" />
Expression Language (EL) This is one of the most important features of the JSTL and is a prominent feature of the JSP 2.0 specification. The Expression Language or EL as it is known is used by JSP developers to access and use application data without using java code. In other words, EL is the replacement for java code within the jsp page. The JSP 2.0 expression language helps to simplify the presentation layer by replacing hard-tomaintain Java scripting elements in jsp page. The EL statements are always used within ${.} Basic syntax The syntax of expression language is very simple. EL expressions are invoked with this syntax: ${expr}, where expr represents an any valid expression. For example, ${20 * 2} For example, Step 1: create a html file to get a user name <html> <body> <form method=post action=ElDemo.jsp> Enter user name: <input type=text name=t1 /> <input type=submit value=submit /> </form> </body></html>
WWW.VIDYARTHIPLUS.COM 2013
Step 2: Create a jsp file to obtain user name from the above html file using EL <%@ page contentType=text/html %> <%@ taglib prefix=c uri=http://java.sun.som/jsp/jstl/core %> <html><body> Entered user name is <c:out value=${param.t1} /> </body></html>
EL Reserved Words: Following words are EL keywords and hence must not be used as identifiers: and eq gt true instanceof mod or ne le false empty not lt ge null div EL Operators
Category Operators Arithmetic +, -, *, / or div, % or mod Relational == or eq, != or ne, < or lt, > or gt, <= or le, >= or ge Logical && or and, || or or, ! or not
MVC (Model -View - Controller) Many web applications are based on the Model-View-Controller (MVC) architecture pattern. That is, web apps contains three parts: 1) business logic 2) presentation and 3) request processing The key motivation behind the MVC approach is the desire to separate the code that creates and manipulates the data (i.e business logic) from the code that presents the data (i.e presentation) and the code that process the request (i.e controller) Business logic means the code applied for manipulation of application data and presentation refers the code written for look and feel of the web page such as background color, font style, placing of form controls and so on. Controller means that process the request message.
WWW.VIDYARTHIPLUS.COM 2013
According to MVC, the Model corresponds to business logic, the View corresponds to presentation and the Controller corresponds to request processing Typical JSP implementation of MVC
Java servlet program is the Controller component that receives the request from the browser. Java bean class is the Model component that processes the business logic which can use the data source for that. Jsp is the View component that presents the result of the business logic to the browser with the help of controller. The following program also illustrates that.
In this architecture, JSP is used for creating the view for the application. A centralized Servlet is used to handle the entire request for the application. The Servlet works as the controller for the application. It then uses the Java beans for processing the business logic and getting the data
WWW.VIDYARTHIPLUS.COM 2013
(Model) from the database. Finally it uses the JSP to render the view which is displayed to the user. Advantage of using MVC MVC allows the developer to keep the separation between business logic, presentation and request processing. Due to this separation, any changes to the presentation can be made easy without disturbing business logic.