Pages Navigation Menu

Coding is much easier than you think

Autocompleter Textbox & dropdown in Struts 2

Posted by on Oct 26, 2013 in Struts 2 Tutorial, Struts-2 | 20 comments

 
To create a Autocompleter component in struts 2, please follow this two steps :
 
1. Add struts2-dojo-plugin.jar in your class path.
2. Include the “struts-dojo-tags” tag and its header(shown below) in your jsp page
 

<%@ taglib prefix="sx" uri="/struts-dojo-tags" %>
<html>
<head>
<sx:head />
</head>

 
** UPDATE: Struts 2 Complete tutorial now available here.
 

Action class

 
AutoCompleteAction.java
 

package com.simplecode.action;

import java.util.ArrayList;
import com.opensymphony.xwork2.Action;

public class AutoCompleteAction implements Action 
{
	public ArrayList<String> cricketNations = new ArrayList<String>();
	public String country;

	public String execute() 
	{
		populateCircketNations();
		return SUCCESS;
	}

	public void populateCircketNations() 
	{
		cricketNations.add("Australia");
		cricketNations.add("England");
		cricketNations.add("India");
		cricketNations.add("West Indies");
		cricketNations.add("New Zealand");
		cricketNations.add("Pakistan");
		cricketNations.add("Bangladesh");
		cricketNations.add("South Africa");
		cricketNations.add("Sri Lanka");
		cricketNations.add("Zimbabwe");
	}

	public String displayCountry() 
	{
		return SUCCESS;
	}

	public String getCountry() 
	{
		return country;
	}

	public void setCountry(String country) 
	{
		this.country = country;
	}	
}

 
Do read: Autocomplete in Struts 2 using Jquery and JSON via Ajax
 

JSP Page

 
autoComplete.jsp
 
Here <%@taglib uri="/struts-dojo-tags" prefix="sx"%> is a directive used in jsp for including dojo ajax tag files.

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<%@taglib uri="/struts-dojo-tags" prefix="sx"%>
<%@taglib uri="/struts-tags" prefix="s"%>
<html>
<sx:head />
<head>
<title>Auto complete</title>
</head>
<body>
<h3>Auto complete Dropdown | Textbox</h3>
<s:form action="displayCountry">
  <sx:autocompleter name="country" list="cricketNations" showDownArrow="false" 
     label="Cricket Nations"/>
<s:submit />
</s:form>
</body>
</html>

 

Note: In <sx :autocompleter> tag, showDownArrow property indicates whether to show dropdown or not, on setting to false textbox will appear and when set to true dropdown box will appear.

struts.xml

 

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
    "http://struts.apache.org/dtds/struts-2.0.dtd">
<struts>
<package name="default" extends="struts-default" namespace="/">
<action name="autoComplete" class="com.simplecode.action.AutoCompleteAction">
    <result name="success">autoComplete.jsp</result>
</action>
<action name="displayCountry" class="com.simplecode.action.AutoCompleteAction"
method="displayCountry">
    <result name="success">WelcomeToCountry.jsp</result>
</action>
</package>
</struts>

 
 
Do read: AJAX implementation in Struts 2 using JQuery and JSON
 

Demo

 
On running the above example

http://localhost:8089/AutoComplete/autoComplete.action

 
Setting showDownArrow = “true”
 
autocompleter dropdown box
 
Setting showDownArrow = “false”
 
autocompleter textbox box
 

dwd2
Zip file – AutoCompleter.zip
War file – AutoCompleter.war

 

Read More