Learn Servlet-JSP By Building A Social Network Website — Part X

Learn Expression Language (EL) and how to apply to JSP pages

Task 14: Reading: Expression Language (EL)

As you have encountered so far, in JSP files, we can embed and execute normal Java code using scriptlet and expression tags to perform some actions such as getting data from the session, retrieving parameters from the request, and so on.

However, keeping embedding Java code in a JSP file can increase messy code that could lead to very hard to maintain our code. Moreover, in large-scale applications, designers who work with JSPs for UI tasks do not know Java code or they may find it is difficult to understand Java implementation.

JSP 2.0 is shipped with an Expression Language (EL) that can be substituted for Java code in trivial front-end tasks.

Of course, EL is not as powerful as Java code but most of the time, EL supports features that we can apply to most situations in web development.

EL supports common operators:

EL support implicit objects:

EL Implicit Objects

Task 15: Applying EL in JSP file

In this task, we are going to use EL to replace JSP scriptlet and expression tags to make JSP file cleaner and more maintainable.

Step 1: update login.jsp page

In the login.jsp file, find the scriptlet tag:

<%= Objects.toString(session.getAttribute(Keys.ERROR), “”) %>

and replace with the corresponding EL:

${sessionScope[Keys.ERROR]}

The above two lines of code perform exactly the same action.

All EL expression must be placed inside ${} with the appropriate implicit object.

Since we have attached the attribute in a session, we need to use the implicit object of sessionScope and provide the key of Keys.ERROR.

Another way to access an attribute or a parameter is to use the dot (.) operator instead of []:

${sessionScope.key}

But because we have defined the key as constant in the Key class, using the square brackets ([]) is the right choice.

Step 2: update register.jsp

In the register.jsp file, find the scriptlet tag:

<%= Objects.toString(request.getAttribute(Keys.ERROR), “”)%>

and replace with the following EL expression:

${requestScope[Keys.ERROR]}

We also need to replace all the JSP expression tag in the <input> tags.

Since in the <input> tags, we have accessed data in the request parameter, we have the counterpart in the in EL:

${param[“key-name”]}

Or

${param.keyName}

So, update your <input> tags in the <form> as follows:

Next, we need to apply EL to the <script> tags as well:

Step 3: update top_nav.jsp

Find the <a href=”profile”> tag:

and replace with the following EL expressions:

As you can see, we don’t need to use scriptlet and expression tags to access the user instance anymore.

Also, pay attention that, since the key Keys.USER in the session is an instance of the User class, the access:

sessionScope[Keys.USER]

will return the User’s instance. Therefore, in order to get User’s variables, for instance, the avatar, we need:

${sessionScope[Keys.USER].avatar}

Next, scroll down a little bit and replace the following code:

with

EL on itself does not support if..else explicitly, it does support a short-hand if-else condition. And that is enough in our case here.

Step 4: update profile.jsp

Since now we do not have the user object anymore, you will find that the profile.jsp produces compiling errors. Don’t worry about that, we are going to replace all of those JSP expression tags with EL expressions.

Find the following tag:

and update with the following EL parts:

Next, find the tag <div class=”overview-form”>…</div> and update with the following changes:

Now come to the next update, we need to perform a little work.

Find the following scriptlet tags:

In the database, we store user birthday in a day-month-year format, and on the front-end page, we display each part in a separate dropdown list. That is the reason why we need to split the birthday value into separate elements.

However, EL by default does not support any way to achieve the same task.

But EL does open the way so that we can add more custom EL expressions by defining a custom EL function.

And in our case here, we need to define a custom EL function so that it can split a string and return an array containing our desired elements.

But first, let’s remove the above code because we don’t need that code anyway.

Step 4.1:

In the StringHelper class in the package net.learnbyproject.helper, add the following method:

The method performs a simple task: returning an array containing split substrings based on the dash (-) character.

Now we need to define a custom EL expression to map with the above method so that when the custom EL expression is called in the JSP file, the above method is executed.

To achieve the task, we need to have a tag library descriptor.

Step 4.2:

Create a new folder named “tlds” the folder WEB-INF

Right-click on the “tlds”, select New, then select Other…

In the File Types pane, find and select a type named “Tag Library Descriptor”, and click Next:

In the TLD Name text field, in put the name as “custom” (or any name you desire) and then click Finish

Step 4.3

Update the custom.tld with the following <function> tags:

• <name>getDateParts</name>: this is the EL expression name we are going to use in the JSP files. Feel free to change to any name you desire.
• <function-class>net.learnbyproject.helper.StringHelper</function-class>: this is the class containing the method mapping with the above EL expression name
• <function-signature> java.lang.String[] getDateParts(java.lang.String) </function-signature>: this the actual method that will be executed when the mapped EL expression is called in the JSP file.

Step 4.4:

Go back to the profile.jsp file and add the following line at the top:

<%@taglib uri=”/WEB-INF/tlds/custom.tld” prefix=”dates” %>

The URI specifies the location of our tag library descriptor file.

The prefix defines the one that is going to be used with the tag declared in the custom.tld file. This is to distinguish if there might be other tags in other tag library files that have the same name.

Scroll down to the <script> tags and update as the following:

The EL expression ${dates:getDateParts(sessionScope[Keys.USER].birthday) returns the result of the method StringHelper.getDateParts() which returns an array containing split date elements. Therefore we need to get the specific day, month, and year by supplying the corresponding index.

And that should be all for this task.

Now it’s time for running the web application to see if things work.

Remember to clean and build your project first.

Since we did not add any new features, everything should work just like previously.

Stuck? Check out the complete source code:

https://github.com/stackera/learn-servlet-jsp/blob/main/Task15_Apply_EL.zip

>> Read Part XI