The University of Akron Summit College Business Technology Dept.

The University of AkronSummit CollegeBusiness Technology Dept. 2440: 141Web Site Administration Introduction to Java Server Pages (JSP) Instructor: Enoch E. Damson

Three-tier Client/Server Architecture Introduction to JSP

Client-side Scripts and Browser Dependency • Client-side scripts are executed in the client browser • The browser must provide an appropriate interpreter • All browsers come with built-in engines to support certain client-side scripting languages Introduction to JSP

Client-Side Scripting Languages • There are two main client-side scripting languages • JavaScript • VBScript • JavaScript is more widely supported than VBScript Introduction to JSP

VBScript Example • <html> • <head> • <title> Client-Side Scripting </title> • </head> • <body> • <p> This page was last modified on: • <script type=“text/vbscript"> • document.writedocument.lastModified • </script> • </p> • </body> • </html> Introduction to JSP

JavaScript Example <html> <head> <title> Client-Side Scripting </title> </head> <body> <p> This page was last modified on: <script type=“text/javascript"> document.write(document.lastModified); </script> </p> </body> </html> Introduction to JSP

Events Handlers Introduction to JSP

Event Handler Example • <html> • <head> • <title> Client-Side Scripting </title> • </head> • <body> • <p> This page was last modified on: <a href="#" onMouseOver="alert('Mouse over')"> Move mouse over link </a> • </p> • </body> • </html> Introduction to JSP

Server-Side Scripting Languages • Server-side scripts are executed on the Web server using directives (such as <% %>) within HTML/XHTML pages • The server must be equipped with an engine that can interpret corresponding scripting code • For example, in order to run JSP, the server must be equipped with an engine that can interpret JSP scripts • Independent of Browser: • Since the Web server sends the results (the execution of server-side script) of server-side scripts back to the client browser as regular HTML content, server-side scripts have nothing to do with the client browser • That means that the server-side scripts will work with any browser Introduction to JSP

Java Server-Side Pages (JSP) • JavaServer Pages technology is an extension of the Java Servlet technology • Servlets are platform-independent, server-side modules that fit seamlessly into a Web server framework and can be used to extend the capabilities of a Web server with minimal overhead, maintenance, and support • Unlike other scripting languages, servlets involve no platform-specific consideration or modifications • They are application components that are downloaded, on demand, to the part of the system that needs them • Both JSP and servlets provide an attractive alternative to other types of dynamic Web scripting/programming by offering: • Platform independence • Enhanced performance • Separation of logic from display • Ease of administration • Extensibility into the enterprise • Ease of use Introduction to JSP

Java Server-Side Pages (JSP)… • JSP is case-sensitive • All JSP scripts must be stored in a file with a .jspextension • Comments are ignored by the compiler • A .jspfile is simply an HTML/XHTML file with Web server directives (<%%>) to execute JSP (Java-like) code in a server • For every opening brace { or parenthesis (, there must be a corresponding closing brace { or parenthesis ) in JSP • JSP statements are terminated with semicolons (;), except comments, method headers, or braces Introduction to JSP

JSP Example <html> <head> <title> Client-Side Scripting </title> </head> <body> <% out.print(“Hello…”); %> </body> </html> Introduction to JSP

JSP versus HTML JSP can perform the following tasks: • Create pages that can display things which will be of interest to a particular user • Collect data from users and return information to a visitor based on the data collected • Connect to and manipulate a database • Modify the content of a Web page, by updating a text file or the contents of a database rather than the HTML code itself • Access file systems via the Internet so that you can read, write, and update files • Utilize extensive Java Applications Programming Interface Introduction to JSP

A Web Server and JSP • A Web server and a JSP engine software needs to be installed on your computer to enable you to write and test JSP code • Any Web server that supports JSP can be used • The Apache Tomcat Web server is a good choice for JSP scripting • Download from: http://tomcat.apache.org • The Java Software Development Kit (Java SE) may need to be installed prior to installing the Apache Tomcat Web Server • Download from: http://www.oracle.com/technetwork/java/index.html Introduction to JSP

Installing the Java Software Development Kit • It is assumed that you are using Windows 2000 Professional, Windows XP Professional, Windows Vista, or Windows 7 • Locate and download the software which is located at: http://www.oracle.com/technetwork/java/index.html • Choose the “Java SE” link under “Downloads” • Download the “JDK x Update x” • Follow the default instructions to install the Java JDK on your computer Introduction to JSP

Installing Apache Tomcat • It is assumed that you are using Windows 2000 Professional, Windows XP Professional, Windows Vista, or Windows 7 • Locate and download the software which is located at: http://tomcat.apache.org • Choose the Tomcat version (e.g. “Tomcat 7.0”) link under “Downloads” • Download any of the “Binary Distributions” • Preferably the “32-bit/64-bit Windows Service Installer” under “Core” • Follow the instructions to install the Apache Tomcat server to your computer • By default, Tomcat will be installed in the directory: C:\Program Files\Apache Software Foundation\Tomcat 7.0\ Introduction to JSP

Testing Apache Tomcat Server Installation and Configuration • Once you have installed and configured the Tomcat server and your Web application, you should check to make sure that it works correctly • Start the Tomcat server if it is not started by clicking on: • Start  ProgramsApache Tomcat 7.0 TomcatMonitor Tomcat • Open a browser window and enter the following URL: http://localhost:8080 • Where 8080 is the port number used for the Apache Tomcat Server during installation • You may change the port number in line number 70 of the configuration file • The configuration file is: C:\Program Files\Apache Software Foundation\Tomcat 7.0\conf\server.xml • You should see the Tomcat default page displayed Introduction to JSP

Executing JSP Scripts • By default, your JSP scripts must be saved at: C:\Program Files\Apache Software Foundation\Tomcat 7.0\webapps\ROOT • This path is the default location for publishing Web pages on the Apache Tomcat Web server • You test your scripts by opening a browser window and entering the following URL: http://localhost:8080/script.jsp • Where 8080 is the Web service port number specified during installation and script.jsp is the file to be executed on the Apache Tomcat Web server Introduction to JSP

Collecting Data Using Web Forms • The HTML/XHTML <form> tag serves as a container that holds controls such as text fields, labels, buttons, and images • E.g. <form name="fname" action="getdata.jsp" method=“post">  </form> Introduction to JSP

<form> Attributes • nameorid: • Used to label the form • action: • Specifies the destination Web page where the form is processed • method: • Specify how to send the form’s to the Web server using either the post or getvalues • get – appends the form’s data to the URL of the Web page • post – hides the form’s data in streams when data is being sent Introduction to JSP

get Method • Form data is appended to the end of the designated URL after a question mark • The URL is the one specified as the ACTION value in a form • If you do not explicitly set the METHOD attribute for a form, by default the form is sent using the GET method Introduction to JSP

post Method • When you use the POST method, the form element data is sent to the server as a transaction message body • Unlike the GET method, the POST method does not append form element data to the URL • Note that when the POST method is used, you can generate a query string by attaching a query string to the URL directly Introduction to JSP

Control Elements in a Form • The input fields on a form are called controls and are created with the <input>, <button>, <select> and <textarea> tags: • The most commonly used tag is the <input> tag • E.g. <form name="fname" action="getdata.jsp" method=“post"> Name: <input type="text" name=“lastname"> </form> Introduction to JSP

Control Elements’ Attributes • type: • Specifies the input type using ten different values (text, password, radio, checkbox, file, image, submit, reset, button, and hidden) for the <input> tag’s type attribute based on the type of control to use • name: • Each control in a form must have a name. The data entered by the user is retrieved by referencing the name of its control field. Without a name, the data stored in the control field cannot be retrieved • value: • Use to hold the data assigned to a form control element • A default value may be assigned to a control element Introduction to JSP

Submitting Form Data • In order to process form data, you need to submit the form to the server, and then retrieve and process data on the server-side • To submit a form, the submit() method of the form must be called using any of these two methods: • Using a form’s submit button control • E.g. <input type=“submit” /> • Explicitly calling the submit() method of a form Introduction to JSP

Using the Submit Button Example <form name="fname“ action="getdata.jsp“ method=“post"> First Name: <input type="text" name="firstname"> <input type=“submit" value="Send"> </form> Introduction to JSP

Form Elements Example <html> <head> </title> Web Form Controls </title> </head> <body> <form name="fname“ action="getdata.jsp" method=“post"> First Name:<input type="text" name="firstName"> <input type=“submit" value="Send"> <input type=“reset" value=“Clear"> </form> </body> </html> Introduction to JSP

Programming Elements • Every programming language uses the following programming elements: • Syntax • Comments • Keywords • Constant data • Data input • Data output • Data types and Variables • Operators and Expressions • Selections (Condition Testing) • Repetitions (Looping structures) • Arrays • File handling Introduction to JSP

Comments • Comments are not displayed on the browser • The HTML/XHTML comments is:  Introduction to JSP

JSP Comments • Ignored at translation time • They are not sent to clients <%-- Multiple line comments --%> <% /* Multiple line comments */ %> <% //Single line comment %> Introduction to JSP

Retrieving Data from a Form’s Control Element Using JSP • To retrieve data stored in Web form control element from the server-side using JSP, use: request.getParameter(“elementName”); where elementName is the value assigned to the nameand/or id attribute of the form’s control • Example: request.getParameter(“firstname”); where firstnameis the value assigned to the name attribute of the form control Introduction to JSP

Output to the Client • JSP output to the client can be done in two ways: • <%= “Your message goes here” %> • or • <% • out.println(“Your message goes here”); • %> • Unlike the first output method: <%= %>, you can put many statements within a single pair of <% %>, with the out.print( ) method, Introduction to JSP

Retrieve/Output Web Form Data Using JSP <html> <head> </title> Retrieving/Displaying Web Form Data </title> </head> <body> Hello, <%= request.getParameter(“firstname") %> </body> </html> Introduction to JSP

Storing Form Information • There are many situations in which you will need to store form information and use it later in your JSP scripts. Like all programming languages, JSP uses variables to temporarily store information • A variable is a location in computer memory where a value is stored for use by a program • In JSP script, all variables must be declared before you can use them • After a variable has been declared, a value can be stored in the variable, and this value can be used throughout your JSP page Introduction to JSP

Variables • A variable is a location in the computer's memory where a data value is stored, or a location that references to another location where an actual object resides • There are two types of data types in JSP: primitive data types and classes • For primitive data types, the data value is stored in the location specified by the variable name; for classes, the actual data value is stored somewhere in memory and the data value is referenced using the variable name Introduction to JSP

Naming Variables • A variable name is any valid identifier • An identifier is a series of characters, consisting of letters, digits, and underscores BUT that does not begin with a numeric digit. • JSP script is case sensitive—uppercase and lowercase letters are different, so varname and VARNAME are different identifiers • A variable name can be any length • All of the following are valid identifiers: String s; String aLongVariableNameButStillValid; intan_integer_variable_name; • Variable names cannot contain spaces or dashes Introduction to JSP

Primitive Data Types • A data typedescribes the information that a variable stores. For example, int variables store integers, or whole numbers • A variable’s data type also determines how many bytes of memory are required to store that variable • Each data type has a range of values. Memory space is allocated to store each variable according to its data type • JSP provides eight primitive data types: • Six of them are numeric • One is character, used for characters in Unicode encoding • One is Boolean, used for true/false values • JSP also provides the Stringclass for multiple characters Introduction to JSP

Numeric Data Types • Examples: byte num = 126; short num= 31000; intnum = 123255; long num = 155428465; float num = 25.35f; double num = 12354.254; Introduction to JSP

booleanData Type • The Boolean data type has two values, true and false • It is used for logical testing using the relational operators • Boolean values are integral part of control structures such as if statements and loops Introduction to JSP

Character (char) Data Type • The character data type is used to represent a single character • Unlike the string type, a character value is enclosed within single quotation marks • Example: • char letter = 'A'; • char numChar = '6'; Introduction to JSP

String Class • The String class is used for variables that hold multiple characters • Example: String name = “John Doe”; Introduction to JSP

Variable Declaration • Variables are declared with the data type followed by the variable name as shown below: dataTypevariableName; • Examples: int x, y; char a; String s1; Introduction to JSP

Assignment • The equal sign = is used as an assignment operator • Example: String s1; s1= “Hi, there.”; Introduction to JSP

Variable Initialization • You can declare and initialize a variable in one step: • E.g., String s2 =“Hi, there.”; Introduction to JSP

Using Variables <html> <head> </title> Getting Data into JSP Variables </title> </head> <body> <% String fname = request.getParameter(“major”); out.println(fname); %> </body> </html> Introduction to JSP

Converting String Values • Data from Web pages (forms elements) are sent to the Web server in String values • JSP has some class methods that allow String values to be converted to any of the 8 primitive data types • The methods that convert String values to the numeric data types are: • Long.parseLong()  converts Strings to long values • Integer.parseInt()  converts Strings to int values • Short.parseShort()  converts Strings to short values • Byte.parseByte()  converts Strings to byte values • Double.parseDouble()  converts Strings to double values • Float.parseFloat()  converts Strings to float values Introduction to JSP

Converting String Values Example <html> <head> </title> Getting Data into JSP Variables </title> </head> <body> <% intmyage = Integer.parseInt(request.getParameter(“age”)); double mysalary = Double.parseDouble(request.getParameter(“salary”)); out.println(myage); out.println(mysalary); %> </body> </html> Introduction to JSP

Operation Arithmetic operator Algebraic expression JSP expression Addition + x + y x + y Subtraction - x – y x - y Multiplication * x * y x * y Division / x / y x / y Modulus % x mod y x % y Arithmetic Operations Introduction to JSP

Operator Example Meaning == != > >= < <= x == y x != y x > y x >= y x < y x <= y x is equal to y x is not equal to y x is greater than y x is greater than or equal to y x is less than y x is less than or equal to y Comparison Operators Introduction to JSP

Conditional Statements • Conditional statements in JSP use if/else statementsto test for conditions before performing tasks • The structure of the JSP if/else statement is: if (condition) { statement(s); } else { statement(s); } Introduction to JSP

The University of Akron Summit College Business Technology Dept.