Home >> Struts
This example will try to cover steps for creating/rendering
Combo box with auto-complete type of functionality.
Using Struts 2 Plug in for DOJO, I will try to come up with
a screen / browser based UI for rendering static and or
dynamic values for any user input keys, and providing
auto complete type of functionality there-after.
There are some tags provided by Struts 2 and DOJO Plug in
Tag Library, those can be used along with appropriate attribute
values will make this example to work with some sort of
dynamic values for the auto-completer to substitute and
help in completing any user input being performed on the
target UI component.
Let me show the Tag I have used in this example as follows:
<s2d:autocompleter id="fruitsList" name="fruitLists"
label="Fruit you like most"
loadOnTextChange="true"
loadMinimumCount="1"
preload="false" href="example/autopopulate"
autoComplete="true"/>
One can go through the official documentation for proper
explaination for all the tags and its attributes, here I shall
share what is my understanding so far on this topic, after
of course running this example/POC on this technology.
id : identified for the browser specific operation with this
component.
name : this goes to the server component as request parameter
label : visible Label on screen
loadOnTextChange : text change event notifier flag for this component
loadMinimumCount : minimum number of character(s)/letter(s) typed
before notification is carried out.
preload : boolean flag for pre loading auto-completer values or not.
href : namespace/action mapping from the struts XML file, for
getting the JSON Array containing the dynamic values.
autoComplete : flag for enabling auto complete or not.
|
Apart from all these attributes, there exist many more attributes
those can be used as and when required.
I have selected these attribute and this example is working
as per my expectation with these attributes with values.
The complete file sample.jsp
<%@ taglib uri="/struts-dojo-tags" prefix="s2d"%>
<html>
<head><title></title>
<s2d:head cache="true"/>
</head>
<body>
<div>
<s2d:autocompleter id="example"
label="Automobile you like most"
list="{'CAR', 'JEEP', 'LAND ROVER', 'TRUCK'}" />
</br>
<s2d:autocompleter id="fruitsList" name="fruitLists"
label="Fruit you like most"
loadOnTextChange="true"
loadMinimumCount="1"
preload="false" href="example/autopopulate"
autoComplete="true"/>
</div>
</body>
</html>
|
Let's look at the struts.xml mapping file located under
WEB-INF/classes folder:
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="dojo-tree-example1" namespace="/example"
extends="struts-default">
<action name="autopopulate" class="example.AutoPopulateAction">
<result>/sample_autopopulate.jsp</result>
</action>
</package>
</struts>
|
AutoPopulateAction.java
package example;
import java.util.*;
import com.opensymphony.xwork2.ActionSupport;
public class AutoPopulateAction extends ActionSupport {
}
|
This action has nothing to do in this example, but one can
write appropriate method and configure action mapping
accordingly to execute this method.
Now looking at this struts.xml file, there is a result mapping
as "sample_auto populate.jsp" file. This file has a very selective
work to perform, it just checks for the request parameter
and depending on the request parameter value, appropriate
JSON string/Array is passed as response, just to be displayed
as auto completer suggestions/values on screen component.
sample_autopopulate.jsp
<%
String listName = (String)request.getParameter("fruitLists");
%>
<% if(listName != null && listName.equalsIgnoreCase("m")) {%>
[ ["Mango"],["Mausombi"]]
<% } else if(listName != null && listName.equalsIgnoreCase("p")) {%>
[ ["Peach"],["Papaya"]]
<% } else if(listName != null && listName.equalsIgnoreCase("O")) {%>
[ ["Orange"]]
<% } else {%>
[ ["Mango"],["Mausombi"],["Peach"],["Papaya"],[Orange]]
<% } %>
|
I think , this is just one way of doing this perticular example
in right order, but there are many other ways of doing this
and any suggestion if you have, is always welcome in this web site,
just drop us an email at
usingframeworks@ gmail . com
If anything missed out , please let me know at
techienjoy at yahoo . com