Function tags provide many functions we can use to perform common operations, most of which are for String manipulation, such as String COncatenation, Split String, etc.
Here are some tags that you can refer to before looking at examples.
SQL tags support interaction with relational databases such as Oracle, MySql etc. Using JSTL SQL tags, we can run database queries. We first need to create a table with the totoro account to demonstrate.
createtable test(
num number,
name varchar2(10),
primary key(num) );
In the code, first, we insert the data and print out the data with the select SQL.
<%@ page language="java" contentType="text/html; charset=EUC-KR"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql"%>
<html><head><title>JSTL sql Tags</title></head><body><sql:setDataSourcevar="conn"driver="oracle.jdbc.driver.OracleDriver"url="jdbc:oracle:thin:@localhost:1521:xe"user="totoro"password="totoro123" /><sql:updatedataSource="${conn}">
INSERT INTO test (num, name) VALUES (1, 'Meadow')
</sql:update><sql:updatedataSource="${conn}">
INSERT INTO test (num, name) VALUES (2, 'Dodo')
</sql:update><sql:updatedataSource="${conn}">
INSERT INTO test (num, name) VALUES (3, 'Forest')
</sql:update><sql:updatedataSource="${conn}">
INSERT INTO test (num, name) VALUES (4, 'Jenny')
</sql:update><sql:queryvar="rs"dataSource="${conn}">
SELECT * FROM test WHERE name=?
<sql:param>Meadow</sql:param></sql:query><c:forEachvar="data"items="${rs.rows}"><c:outvalue="${data['num']}" /><c:outvalue="${data['name']}" /><br></c:forEach></body></html>
Search the table with select * from test; , you will see the inserted data.
As we discussed, Model 2 consists of Java Servlet, EL(Expression Language), and JSTL(JSP Standard Tag Library). In this post, we will learn about JSTL.
JSLT, itself stands for JSP Standard Tag Library. So what do we need to do first?
Provide many functions that we can use to perform common operation, most of them are for String manipulation such as String Concatenation, Split String etc.
<%@ page contentType = "text/html; charset=utf-8" %>
<html><body><formmethod=postaction=ifTag.jsp>
Name <inputtype=textname=name><br>
Age <inputtype=textname=age><br><inputtype=submitvalue="Submit"></form></body></html>
ifTag.jsp
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<c:iftest="true">
If the test value is "true", it always runs. <br></c:if><c:iftest="${param.name == 'Meadow' }">
Hello ${param.name }, welcome! <br></c:if><c:iftest="${param.age >= 18 }">
You are an adult! haha!<br></c:if>
choose tag
choose ~ when ~ otherwise tag is used when we process multiple conditions.
It is the same as switch ~ case ~ default in java.
If there is a condition that the value meets, it will execute the tag and stop execution.
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html><html><head><metacharset="EUC-KR"><title>Insert title here</title></head><body><ul><c:choose><c:whentest="${param.name == 'Meadow' }"><li>Your name is ${param.name }.</li></c:when><c:whentest="${param.bloodtype == 'O' }"><li>Your bloodtype is O! People with type O blood less
susceptible to malaria.</li></c:when><c:whentest="${param.bloodtype == 'A' }"><li>Your bloodtype is A! People with type A blood are more
likely to develop stomach cancer.</li></c:when><c:whentest="${param.bloodtype == 'AB' }"><li>Your bloodtype is AB! People with type AB blood are much
more likely to develop cognitive issues.</li></c:when><c:whentest="${param.bloodtype == 'B' }"><li>Your bloodtype is B! About 9% of the population have B
positive blood.</li></c:when><c:otherwise><li>Your name is not Meadow, and there is no such bloodtype.
</li></c:otherwise></c:choose></ul></body>
</html
If I enter the name "Meadow", it will stop executing at the first condition since it meets the condition.
If I enter the other name and the blood type(O,A,AB, or B), it will execute that condition.
catch tag / out tag
<%@ page language="java" contentType="text/html; charset=utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html><head><title>JSTL core Library Example 1</title></head><body><c:setvar="test"value="Hello JSTL!" /><h3>
Using <c:set> :
<c:outvalue="${test}" /></h3><c:removevar="test" /><h3>
Using <c:remove> :
<c:outvalue="${test}" /></h3><c:catchvar="err">
<%=10 / 0%>
</c:catch><h3>
An error caught by <c:catch>:
<c:outvalue="${err}" /></h3><c:iftest="${5<10}"><h3>5 is lesser than 10.</h3></c:if><c:iftest="${6+3==9}"><h3>6 + 3 equals 9.</h3></c:if><c:choose><c:whentest="${5+10==50}"><h3>5+10 equals 50.</h3></c:when><c:otherwise><h3>5+10 not equal 50.</h3></c:otherwise></c:choose></body></html>
forEach tag
It is like a loop in java, while the format is different from it.
There are two big types in this forEach tag. Type 1 is more used than the other. Let us look at the example codes.
<%@page import="java.util.ArrayList"%>
<%@page import="java.util.List"%>
<%@ page contentType="text/html; charset=utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
java.util.HashMap mapData = new java.util.HashMap();
mapData.put("name", "Meadow");
mapData.put("today", new java.util.Date());
%>
<c:setvar="intArray"value="<%=new int[] { 1, 2, 3, 4, 5 }%>" /><c:setvar="map"value="<%=mapData%>" /><html><head><title>forEach Tag</title></head><body><h4>Sum of odd integers from 1 to 100.</h4><c:setvar="sum"value="0" /><c:forEachvar="i"begin="1"end="100"step="2"><c:setvar="sum"value="${sum + i}" /></c:forEach>
Result = ${sum}
<h4>4 Times table</h4><ul><c:forEachvar="i"begin="1"end="9"><li>4 * ${i} = ${4 * i}
</c:forEach></ul><h4>Array - Datatype int</h4><c:forEachvar="i"items="${intArray}"begin="2"end="4">
[${i}]
</c:forEach><h4>Map</h4><c:forEachvar="i"items="${map}">
${i.key} = ${i.value}<br></c:forEach><br><br>
<%
List list = new ArrayList();
list.add("Toronto");
list.add("Halifax");
list.add("Vancouver");
list.add("Calgary");
list.add("Airdrie");
list.add("Winnipeg");
list.add("Yellowknife");
request.setAttribute("slist", list);
%>
<!-- Type 1 --><c:forEachvar="s"items="${slist}">
${s} <br></c:forEach><br><br>
<%
// Origianl code
List li = (List) request.getAttribute("slist");
for (int i = 0; i < li.size(); i++) {
String str = (String) li.get(i);
out.println(str + "<br>");
}
%><br><br><!-- Type 2 --><c:setvar="s1"value="<%=list %>"/><c:forEachvar="s2"items="${s1}">
${s2} <br></c:forEach></body></html>
To develop with the Model2 MVC patterns, we need to know Java Servlet, EL(Expression Language), and JSTL(JSP Standard Tag Library), and we already covered the Java Servlet class in the last posts. If you want to go check out, please click the link below.
In this post, we will discuss Expression Language, which we use instead of Expression tags in the model2, we use Expression language. It looks different from the expression tags we have been using, but once we get used to it, it will be easier and simpler.
For example, param is used as${param.name} and sessionScope is used as${sessionScope.id}
For a better understanding, let us look through the examples.
Example 1
Arithmetic Operators
To print out the EL on the browser, you must use "\".
<TR><TD>\${2 + 5}</TD><TD>${2 + 5}</TD></TR>
To divide, you can use either "/" or "div" and the result will be the same. "mod" is to get the remainder.
<TR><TD>\${4/5}</TD><TD>${4/5}</TD></TR><TR><TD>\${5 div 6}</TD><TD>${5 div 6}</TD></TR><TR><TD>\${5 mod 7}</TD><TD>${5 mod 7}</TD></TR>
Comparison Operators
"<" is same as "gt"(greater) and ">" is same as "le"(less).
<TR><TD>\${2 < 3}</TD><TD>${2 < 3}</TD></TR><TR><TD>\${2 gt 3}</TD><TD>${2 gt 3}</TD></TR><TR><TD>\${3.1 le 3.2}</TD><TD>${3.1 le 3.2}</TD></TR>
<%@ page contentType="text/html;charset=utf-8"%>
<% request.setCharacterEncoding("utf-8");%>
<HTML><HEAD><TITLE>EL Example2</TITLE></HEAD><BODY><H3>Processing parameter value</H3><P><FORMaction="eLEx2.jsp"method="post">
Name : <inputtype="text"name="name"value="${param['name']}"><inputtype="submit"value="Submit"></FORM><P>
Hello <%=request.getParameter("name") %>, how are you today? <br>
Would you like to have a cup of tea, ${param.name}?
</BODY></HTML>
The followings bring the same result, but as you can see, EL is simpler than JSP expression tag.
You can also use ${param['name']}.
Hello <%=request.getParameter("name") %>, how are you today? <br>
Would you like to have a cup of tea, ${param.name}?
${param['name']}
There are several ELs that you can use simpler way.
In the last post, we talked about the difference between Model1 and Model2.
To know more about Model2, we need to know Java Servlet, EL(Expression Language), and JSTL(JSP Standard Tag Library). First, let us discuss about Java Servlet Class.
Java Servlet Class Java Servlet Class means all the web programs that is written in Java language. This class can include the HTML, and JavaScript codes and it can print out the codes on the web browser right away.
To create the Java Servlet Class in Eclipse, Java EE has to be selected as a perspective.
In the new dynamic web project, in the src folder, create a new Servlet.
The class name and the file name will be the same. As you can see, its superclass is automatically designated as the HttpServlet class, so this class will be inherited as extends.
Since we don't need any constructors, we are ticking out the box, and we will leave others as they are.
Then, you will see this codes with doGet method and doPost method, as we checked the box.
For better understanding, this time, let us make another servlet class with HTML file.
Example 1
Method.java
doPost class is connected to the Call with get method, and the doGet class is connected to the Call with post method.
package send;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
/**
* Servlet implementation class Method
*/@WebServlet("/Method")publicclassMethodextendsHttpServlet{
privatestaticfinallong serialVersionUID = 1L;
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/protectedvoiddoGet(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {
// TODO Auto-generated method stub
response.setContentType("text/html;charset=UTF-8");
PrintWriter out = response.getWriter();
out.println("<h1>Processed with a get method.</h1>");
}
/**
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
*/protectedvoiddoPost(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {
// TODO Auto-generated method stub
response.setContentType("text/html;charset=UTF-8");
PrintWriter out = response.getWriter();
out.println("<h1>Processed with a post method.</h1>");
}
}
Method.html
The action has to correspond to the annotation(@) in the servlet class.
<htmllang="en"><head><metacharset="utf-8"></head><body><!-- action = "/Project name/Servlet file name"
No package name needed.
--><formmethod="get"action="/jsppro/Method"><inputtype="submit"value="Called with get method"></form><formmethod="post"action="/jsppro/Method"><inputtype="submit"value="Called with post method"></form></body></html>
Example 2
Let us exercise more with a little bit more complicated example.
QueryString.html
<htmllang="en"><head><metacharset="utf-8"></head><body><formmethod="get"action="/jsppro/QueryString">
ID : <inputtype="text"name="id"size="20"><br>
Password : <inputtype="password"name="pw"size="20"><br>
Name : <inputtype="text"name="name"size="20"><br>
Group : <inputtype="radio"name="group"value="member"> Member
<inputtype="radio"name="group"value="Manager"> Manager<br>
Phone : <selectname="phone1"><optionvalue="010"selected> 010 </option><optionvalue="011"> 011 </option><optionvalue="016"> 016 </option><optionvalue="017"> 017 </option><optionvalue="018"> 018 </option><optionvalue="019"> 019 </option></select>
- <inputtype="text"name="phone2"size="4"maxlangth="4">
-
<inputtype="text"name="phone3"size="4"maxlangth="4"><br><inputtype="submit"value="Sumbit"></form></body></html>
QueryString.java
package send;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
/**
* Servlet implementation class QueryString
*/@WebServlet(description = "Exercise", urlPatterns = { "/QueryString" })publicclassQueryStringextendsHttpServlet{
privatestaticfinallong serialVersionUID = 1L;
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse
* response)
*/protectedvoiddoGet(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {
// TODO Auto-generated method stub
response.setContentType("text/html;charset=utf-8");
PrintWriter out = response.getWriter();
String id = "", name = "", vclass = "", phone1 = "", phone2 = "", phone3 = "";
id = request.getParameter("id");
name = request.getParameter("name");
vclass = request.getParameter("group");
phone1 = request.getParameter("phone1");
phone2 = request.getParameter("phone2");
phone3 = request.getParameter("phone3");
out.println("<html><head></head><body>");
out.println("The data that you inserted is processed with [GET method].<br> ID : <b>");
out.println(id);
out.println("</b><br> Name : <b>");
out.println(name);
out.println("</b><br> Group : <b>");
out.println(vclass);
out.println("</b><br> Phone : <b>");
out.println(phone1);
out.println("-");
out.println(phone2);
out.println("-");
out.println(phone3);
out.println("</b><br><a href='javascript:history.go(-1)'>Go back</a>");
out.println("</body></html>");
out.close();
}
/**
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse
* response)
*/protectedvoiddoPost(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {
// TODO Auto-generated method stub
response.setContentType("text/html;charset=utf-8");
request.setCharacterEncoding("utf-8");
PrintWriter out = response.getWriter();
String id = "", name = "", vclass = "", phone1 = "", phone2 = "", phone3 = "";
id = request.getParameter("id");
name = request.getParameter("name");
vclass = request.getParameter("group");
phone1 = request.getParameter("phone1");
phone2 = request.getParameter("phone2");
phone3 = request.getParameter("phone3");
out.println("<html><head></head><body>");
out.println("The data that you inserted is processed with [POST method].<br> ID : <b>");
out.println(id);
out.println("</b><br> Name : <b>");
out.println(name);
out.println("</b><br> Group : <b>");
out.println(vclass);
out.println("</b><br> Phone : <b>");
out.println(phone1);
out.println("-");
out.println(phone2);
out.println("-");
out.println(phone3);
out.println("</b><br><a href='javascript:history.go(-1)'>Go back</a>");
out.println("</body></html>");
out.close();
}
}
If you change the method from "get" to "post" it will change like this below.
Now, we will add the DTO and DAO classes. We also have to edit a little bit of QueryString.java.
We add this(below) is in the doPost class,
String pw = "";
this(below) to connect to the DTO and DAO.
QueryDTO query = new QueryDTO();
query.setId(id);
query.setPw(pw);
query.setName(name);
query.setVclass(vclass);
query.setPhone(phone1+"-"+phone2+"-"+phone3);
QueryDAO dao = QueryDAO.getInstance();
dao.insert(query); //Sign up
Now, we will create a table on Oracle to connect the database and save the data.
createtable query(
id varchar2(20),
pw varchar2(20),
name varchar2(20),
vclass varchar2(20),
phone varchar2(30));
Checkboxes
Here is an example of dealing with the checkboxes in the servlet.
multiPara.html
<htmllang="en"><head><metacharset="UTF-8"></head><body><formmethod="post"action="/jsppro/multiPara"><h2>Programming Languages</h2><br>
Which languages can you use for programming?<br><hr><inputtype="checkbox"name="plang"value="C"> c
<inputtype="checkbox"name="plang"value="Java"> Java
<inputtype="checkbox"name="plang"value="JavaScript"> JavaScript<br><inputtype="checkbox"name="plang"value="C++"> C++
<inputtype="checkbox"name="plang"value="Python"> Python
<inputtype="checkbox"name="plang"value="Assembly"> Assembly<br><inputtype="submit"value="Submit"></form></body></html>
multiPara.java
Since the "post" method is requested, it will be processed in the doPost method.
So far, in JSP, what we do was Model1, and in this post, we will explore Model2.
The biggest difference between Model1 and Model2 is whether there is Servlet(Controller class) or not.
Here are the architectures of each model.
Source: OracleSource: Oracle
In Model1, we use only JSP, JSP, or Java Bean. It is relatively easy to learn and fast to develop.
However, it can be confusing on the JSP page since the presentation, and business logic are on one page. For this reason, it is sometimes hard to separate the developer's and the designer's work.
On the other hand, Model2 separates the roles of the application into model, view, and controller. It is certainly easy to maintain and expand the service and split the responsibility of each developer and the designer. However, as it is better arranged than Model1, the projects often take longer. Moreover, the programmers must understand the MVC(Model-View-Controller) structure.
So, what is MVC?
MVC is a development methodology that separates the application into three parts: Model, View, and Controller.
Model process the application's data by using the service and DAO class. View process the user interface, normally designers develop this part, consisting of EL(Expression Language) and JSTL(JSP Standard Tag Library). The controller adjusts the flow between the Model and View with the Java Servlet.
To know better about the MVC patterns, we first need to study Java Servlet, EL(Expression Language), and JSTL(JSP Standard Tag Library) and in the next posts, we will study more about them.
It would help if you had some place to store your data on any website or webpage. Even if you made a perfect website with JSP, unless you connect it to DB, it wouldn't have any function to store the users' information. So, It is essential to know how to connect the two sources.
There are three significant ways to connect JSP and Oracle: JDBC(Java DataBase Connectivity), DBCP(DataBase Connection Pool), and ORM(Object Relational Mapping) framework. iBatis, MyBatis, hibernate, and JPA are ORM frameworks. Among them, we will discuss JDBC first.
JDBC
JDBC Configuration
To connect to Oracle, you first need a JDBC Driver. Depending on the version set on your PC, I will download an ojdbc6.jar.
After then, we will test if the connection is successfully run or not. Oracle Smith account must be connected if you want to connect them successfully.
Before, let us look at the JSP Model1 architecture.
JSP Model1 architecture
We already made a DTO class in Java, and that is JavaBean.
JavaBean is a component written in Java.
There are some things that you need to consider when you make a Javabean.
1. In JavaBean, the member variable is called property. 2. Property is a field for storing values created by declaring the access controller private. 3. Properties are used as intermediate data storage when the contents of the JSP page are stored in the DB or when the contents stored in the DB are printed on the JSP page. 4. set() method and get() method are used a lot in JavaBean, and they mainly use public access modifiers. 5. The Java Bean file's storage location should be in the WEB-INF/classes folder.
We will make a java file called "SimpleBean.java" in the src folder.
You can easily write generate getters and setters by right-clicking the mouse.
The <jsp:include>action tag includes other pages along with (<%@include file=heheader.jsp" %>). While the include directive simply contains text from a specific source, the <jsp:include> action tag includes the processing results of the page. You can include HTML, JSP, Servlet, and etc.
Let us look at the examples for a better understanding.
<Example 1>
incldeForm.jsp
<%@ page contentType="text/html;charset=euc-kr"%>
<html><body><h1>include Example</h1><formmethod=postaction="includeMain.jsp">
Name : <inputtype="text"name="name"><p><inputtype="submit"value="Submit"></form></body></html>
So, in the browser, you will see includeMain.jsp page including includeSub.jsp page.
<Example 2>
incldeForm2.jsp
<%@ page contentType="text/html;charset=euc-kr"%>
<html><body><h2>include Example2</h2><formmethod=postaction="includeMain2.jsp">
Site Name : <inputtype="text"name="siteName1"><p><inputtype="submit"value="Submit"></form></body></html>
includeMain2.jsp
Here, <jsp:param> convey the "siteName" to this file from includeForm2.jsp.
Both include directive tag and include action tag are similar in that they all include other pages, but the include directive tag contains only the text, whereas the include action tag contains the results of the page's processing.
Here is another example.
<Example 3>
includer.jsp
<%@ page contentType = "text/html; charset=euc-kr" %>
<html><head><title>include Directive</title></head><body>
<%
int number = 10;
%>
<%@ include file="includee.jspf" %>
Common Variable DATAFOLDER = "<%= dataFolder %>"
</body></html>
includee.jspf
The 'f' in jspf means 'fraction'.
<%@ page contentType = "text/html; charset=euc-kr" %>
Number saved in includer.jsp page: <%= number %>
<p>
<%
String dataFolder = "c:\\data";
%>
The error data should exceed 512 bytes. If the length of the error page is less than 512 bytes, Internet Explorer does not print the error page that this page prints It outputs its own 'HTTP error message' screen. To print the contents of an error page correctly in Internet Explorer, you need to include the same in responding to this comment.
So far, we have discussed the formal way of handling exceptions, but unless you have just several pages, you will need to use the latter way tohandle exceptions using error-page element en web.xml file.
Instead of the errorPage directive, the error page can be specified in the web.xml file of <error-page> tags.
The web.xml file has to be in WEB-INF folder. Anything you need, to handle the exceptions, you have to put in the web.xml file. Here is the web.xml file.
