Struts 2 Form Tags - Naukri Code 360

Introduction🧑🏻‍🎓

A subset of Struts UI Tags is the list of form tags. These tags, which can be divided into three groups, aid in rendering the user interface necessary for Struts web applications.

In the following article, we will learn about the struts 2 form tag in detail. Let’s go! 🫡

Form Tag in Struts 2🧐

Various UI component tags are used in struts web applications to generate forms similar to HTML. Forms are created using a variety of struts UI tags, including the form tag, textfield tag, password tag, textarea tag, checkbox tag, select tag, and radio tag. When the user wants to provide any input that will be later retrieved, these tags come in handy.

There are three types of UI tags, namely-

Simple UI Tags
Group UI Tags
Select UI Tags

Simple UI Tags🤔

Let's have a look at an email.jsp view page with a few basic UI tags.

<%@ page language = "java" contentType = "text/html; charset = ISO-8859-1"
   pageEncoding = "ISO-8859-1"%>
<%@ taglib prefix = "s" uri = "/struts-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
   "http://www.w3.org/TR/html4/loose.dtd">

<html>
   <head>
      <s:head/>
      <title>Hello World</title>
   </head>
   
   <body>
      <s:div>Email Form</s:div>
      <s:text name = "Please fill in the form below:" />
      
      <s:form action = "hello" method = "post" enctype = "multipart/form-data">
         <s:hidden name = "secret" value = "abracadabra"/>
         <s:textfield key = "email.from" name = "from" />
         <s:password key = "email.password" name = "password" />
         <s:textfield key = "email.to" name = "to" />
         <s:textfield key = "email.subject" name = "subject" />
         <s:textarea key = "email.body" name = "email.body" />
         <s:label for = "attachment" value = "Attachment"/>
         <s:file name = "attachment" accept = "text/html,text/plain" />
         <s:token />
         <s:submit key = "submit" />
      </s:form>
      
   </body>
</html>

If you are familiar with HTML, you will see that all of the tags are standard HTML tags with additional prefix s: as illustrated in the code above.

If you have set up proper mapping for all the keys utilized, you will see the following user interface when we run the software as mentioned above.

s:head- The javascript and css elements needed for the Struts2 application are generated by the s:head tag.
s:div- A HTML Div element is rendered using the s:div tag. This is helpful for those who prefer not to combine HTML and Struts tags. Using s:div to render a div is an option for those individuals.
s:text- To display a text on the screen, we use the s:text.
s:form- The action element of the s:form tag specifies where the form should be submitted. We must set the enctype to multipart because the form contains a file upload element. If not, we can leave this field empty.
s:submit- The s:submit tag appears after the form tag. The form is submitted using this. All form values are submitted to the action defined in the s:form tag when the form is submitted.
secret- We have a hidden attribute called secret inside the s:form. By using this attribute, a hidden HTML element is rendered. In this instance, the value of the "secret" element is "abracadabra." This element transfers the state from one view to another but is invisible to the end user.
s:textfield- Used for rendering the input field.
s:label- Used for rendering the label.
s:password- Used for rendering the password.
s:textarea- Used for rendering the textarea.
s:file- The s:file tag then creates a component for an input file upload. The user can upload files using this component. The "accept" element of the s:file tag has been utilized in this example to declare which file types are acceptable for uploading.
s:token- The token tag creates a special token that is used to determine whether a form has been submitted more than once.

When the form is rendered, the token value is set in a hidden variable. Let's take the token, which is "ABC," as an example. The Struts Fitler compares the token with the token saved in the session when this form is submitted. The token is removed from the session if it matches. The form will now be submitted again with "ABC" as the token if it is unintentionally refreshed or returned by pressing the browser's back button. In this situation, the filter performs a second check of the token against the token kept in the session. The Struts filter will deny the request since the token "ABC" has been removed from the session and will not match.

Group UI Tags🤔

Radio buttons and checkboxes are made using group UI tags. Let's look at the straightforward HelloWorld.jsp view page with checkboxes and radio buttons.

<%@ page contentType = "text/html; charset = UTF-8"%>
<%@ taglib prefix = "s" uri = "/struts-tags"%>

<html>
   <head>
      <title>CodingNinjas</title>
      <s:head />
   </head>
   
   <body>
      <s:form action = "hello.action">
         <s:radio label = "Occupation" name = "occupation" list="{'student','teacher'}" />
         <s:checkboxlist label = "Interests" name = "interests"
         list = "{'chess','netflix','music'}" />
      </s:form>
      
   </body>
</html>

Our output from running the application above will resemble the following when complete-

Now let's examine the illustration. In the first example, we're making a straightforward radio button that says "Occupation." Since the radio button tag's name property is required, we give it the name "occupation." Then we provide the gender list. The words "Student" and "Teacher" are included in the list. As a result, we receive a radio button with two values in the output.

In the second illustration, a checkbox list is created. This is done to compile the user's interests. We are utilizing the checkbox rather than the radio button because the user may have multiple Interests. The checkbox has the items "Chess", "Netflix", and "Music" on the list. This lists the Interests as a list of checkboxes.

Select UI Tags🤔

Let's look at the various Select Tag iterations that Struts offer. Check out the straightforward HelloWorld.jsp view page with some chosen tags.

<%@ page contentType = "text/html; charset = UTF-8"%>
<%@ taglib prefix = "s" uri = "/struts-tags"%>

<html>
   <head>
      <title>Hello World</title>
      <s:head />
   </head>
   
   <body>
      <s:form action = "login.action">
         <s:select name = "username" label = "Username"
            list = "{'Mike','John','Smith'}" />

         <s:select label = "Company Office" name = "mySelection"
            value = "%{'America'}" list="%{#{'Am-erica':'America'}}">
            <s:optgroup label = "Asia" 
               list = "%{#{'India':'India','China':'China'}}" />
            <s:optgroup label = "Europe"
               list="%{#{'UK':'UK','Sweden':'Sweden','Italy':'Italy'}}" />
         </s:select>

         <s:combobox label = "My Sign" name = "mySign"
            list = "#{'aries':'aries','capricorn':'capricorn'}" headerkey = "-1" 
            headervalue = "--- Please Select ---" emptyOption = "true" value = "capricorn" />
         <s:doubleselect label = "Occupation" name = "occupation"
            list = "{'Technical','Other'}" doublename = "occupations2"
            doubleList="top == 'Technical' ? 
            {'I.T', 'Hardware'} : {'Accounting', 'H.R'}" />
      </s:form>
   </body>
</html>

Our output from running the application mentioned above will resemble the following-

Let's now review each of the examples individually.

The select tag first renders the HTML select box. In the first illustration, we're making a straightforward pick box with the label "username" and the name "username". The names Mike, John, and Smith will appear in a list that the select box will display.
In the second case, our business's corporate headquarters are in America. Asia and Europe are home to its international offices. We want to organize the global offices by the name of the continent while still displaying the offices in a pick box. Here is where the optgroup is useful. To create a new group, we use the s:optgroup tag. We assign a label and a different list to the group.
The combobox is employed in the third illustration. A combo box combines a select box with an input field. The user can choose a value from the pick box, in which case the value they have chosen is automatically entered into the input field. No values from the pick box will be chosen if the user enters a value directly.
In our illustration, the combobox lists the zodiac signs. Only four options are listed in the selectbox, so if the user's sun sign is not among them, he can put it in. We also provide the select box with a header entry. The select box's header entry is the text that appears there. In this instance, we wish to show "Please Select" If the user makes no selections, -1 is taken as the value. In some circumstances, we don't want the user to choose an empty value. The "emptyOption" attribute would be set to false in certain circumstances. Finally, we set "capricorn" as the combobox's default value in our example.
The fourth instance includes a double select. You use a double select when you wish to display two select boxes. The second select box's contents are based on the value chosen in the first select box. Technical and "Other" are displayed in the first choice box in our case. The second pick box will show IT and Hardware if the user chooses Technical. Otherwise, HR and Accounting will be displayed. The example demonstrates that we can use the "list" and "doubleList" attributes.

In the illustration mentioned above, we compared the top choice box to Technical to determine if it was equivalent. If so, IT and Hardware are displayed.

The bottom box ("doubleName" = "occupations2") and the top box ("name" = "Occupations") must both have names.

Frequently Asked Questions

What are the Struts 2 tags?

The Struts 2 HTML Tags drawer allows you to build Struts HTML tags. These tags, along with others that are usually helpful in the building of HTML-based user interfaces, are used to create Struts input forms. When in XHTML mode, the output is XHTML 1.0 compliant or HTML 4.01 compliant.

What is form bean in Struts 2?

Advertisements. By combining the set and push tags, the bean tag enables you to create a new instance of an object and then set the values of its variables. The bean is then made accessible in the value stack so the JSP page can use it.

Is Struts 2 still in use?

Yes, the Apache Struts project is still maintained and actively being developed despite being on the market for approximately 18 years.

What is the latest version of Struts 2?

The most recent version of the Struts 2 framework is Struts 2.5. 22 was made available on November 29, 2019. The 2.5 Struts.

What is the return type of execute() method in struts2?

The framework has pre-defined return values for the action's execute() method, including SUCCESS, ERROR, INPUT, LOGIN, and NONE.

Conclusion

In this article, we learned about the form tag in Struts 2 framework. We began with a brief introduction to the form tag Struts 2, followed by its types and examples.

After reading about building a project in Struts 2, refer to Struts 2 documentation, Struts Tutorial for beginners, Struts 2 Intro, and 15 Best Java frameworks to use in 2022-Coding Ninjas or a deeper understanding of Struts 2 development and other related topics.

Refer to our guided paths on Coding Ninjas Studio to learn more about DSA, Competitive Programming, JavaScript, System Design, etc. Enroll in our courses and refer to the mock test and problems available. Take a look at the interview experiences and interview bundle for placement preparations.

Do upvote our blog to help other ninjas grow.

Happy Learning Ninja! 🥷