Here comes some button set examples. It is so simple that it can not be explained. The AJAX-JSON call has to be pondered a bit.
The AJAX submit activates the jsonsample action. the data structures that are defined in the jsonsample and updated in the execute method can be accessed at AjaxForms10.jsp's
...
<sj:checkboxlist
...
list="languageList"
...
So, when the JsonSample.java works the list of the checkbox is set.
struts.xml has the below entry for jsonsample:
...
<action name="jsonsample" class="ARS.JsonSample" method="execute">
<result type="json"></result>
</action>
...
The full code is below:
AjaxForms10.jsp
---------------
<%--
Buttonset / Checkboxes
--%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<html>
<head>
<sj:head/>
</head>
<body>
<div id="formResult">formResult</div>
Buttonset that was populated from a List with String values.
<s:form id="form" action="echo" theme="xhtml">
<sj:checkboxlist
id="checkboxbuttonset"
tooltip="Choose your Friends"
label="Friends"
list="{'Patrick', 'Jason', 'Jay', 'Toby', 'Rene'}"
name="echo"/>
<sj:submit
targets="formResult"
value="AJAX Submit"
indicator="indicator"
button="true"
/>
</s:form>
<br/>
Buttonset that was populated from AJAX JSON Result.
<s:form id="form2" action="echo" theme="xhtml">
<s:url id="remoteurl" action="jsonsample"/>
<sj:checkboxlist
href="%{remoteurl}"
id="remoteCheckboxlist"
name="echo"
list="languageList"
label="Language"
/>
<sj:submit
targets="formResult"
value="AJAX Submit"
indicator="indicator"
button="true"
/>
</s:form>
<img id="indicator" src="images/indicator.gif" alt="Loading..." style="display:none"/></body>
</html>
JsonSample.java
---------------
/*
* To change this template, choose Tools | Templates
* and open the template in the editor.
*/
package ARS;
import com.opensymphony.xwork2.Action;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import com.opensymphony.xwork2.ActionSupport;
public class JsonSample extends ActionSupport{
private static final long serialVersionUID = -2223948287805083119L;
private List<String> languageList;
private List<ListValue> languageObjList;
private Map<String, String> languageMap;
// @Actions({
// @Action(
// value="/jsonsample",
// results={
// @Result(name="success",type="json")
// })
// })
public String execute() {
languageList = new ArrayList<String>();
languageObjList = new ArrayList<ListValue>();
languageMap = new HashMap<String, String>();
languageList.add("Java");
languageList.add("PHP");
languageList.add("C++");
languageMap.put("J", "Java");
languageMap.put("P", "PHP");
languageMap.put("C", "C++");
languageObjList.add(new ListValue("J", "Java"));
languageObjList.add(new ListValue("P", "PHP"));
languageObjList.add(new ListValue("C", "C++"));
return SUCCESS;
}
public String getJSON(){
return execute();
}
public List<String> getLanguageList()
{
return languageList;
}
public Map<String, String> getLanguageMap()
{
return languageMap;
}
public List<ListValue> getLanguageObjList()
{
return languageObjList;
}
public class ListValue {
private String myKey;
private String myValue;
public ListValue(String myKey, String myValue) {
super();
this.myKey = myKey;
this.myValue = myValue;
}
public String getMyKey()
{
return myKey;
}
public void setMyKey(String myKey)
{
this.myKey = myKey;
}
public String getMyValue()
{
return myValue;
}
public void setMyValue(String myValue)
{
this.myValue = myValue;
}
}
}
Almost the same...
AjaxForms11.jsp
---------------
<%--
Buttonset / Radio Buttons
--%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<html>
<head>
<sj:head/>
</head>
<body>
<strong>Result Div :</strong>
<div id="formResult" class="result ui-widget-content ui-corner-all">Submit form bellow.</div>
<strong>Buttonset that was populated from a List with String values.</strong>
<s:form id="form" action="echo" theme="simple">
<label for="echo">Choose your Friend: </label>
<sj:radio
id="radiobuttonset"
list="{'Patrick', 'Jason', 'Jay', 'Toby', 'Rene'}"
name="echo"
onChangeTopics="submitForm1"
/>
<br/>
<sj:submit
targets="formResult"
value="AJAX Submit"
indicator="indicator"
button="true"
listenTopics="submitForm1"
cssStyle="display:none;"
/>
</s:form>
<br/>
<strong>Buttonset that was populated from AJAX JSON Result with onChangeTopic.</strong>
<s:form id="form2" action="echo" theme="xhtml">
<s:url id="remoteurl" action="jsonsample"/>
<sj:radio
href="%{remoteurl}"
id="remoteRadiobuttons"
name="echo"
list="languageMap"
label="Language"
onChangeTopics="submitForm2"
/>
<sj:submit
id="form2button"
targets="formResult"
value="AJAX Submit"
indicator="indicator"
button="true"
listenTopics="submitForm2"
cssStyle="display:none;"
/>
</s:form>
<img id="indicator" src="images/indicator.gif" alt="Loading..." style="display:none"/>
</html>
AJAX select examples.
AjaxForms12.jsp
---------------
<%--
form example from the AJAX command section
--%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<html>
<head>
<sj:head/>
</head>
<body>
<s:form id="formSelectOne" action="echo" theme="simple" cssClass="yform">
<fieldset>
<legend>AJAX Form populated by a String List</legend>
<div class="type-text">
<label for="echo">Echo: </label>
<s:url id="remoteurl" action="jsonsample"/>
<sj:select
href="%{remoteurl}"
id="echo"
name="echo"
list="languageList"
emptyOption="true"
headerKey="-1"
headerValue="Please Select a Language"
/>
</div>
<div class="type-button">
<sj:submit
targets="result1"
value="AJAX Submit"
indicator="indicator"
button="true"
/>
<img id="indicator" src="images/indicator.gif" alt="Loading..." style="display:none"/>
</div>
</fieldset>
</s:form>
<strong>Result Div 1 :</strong>
<div id="result1" class="result ui-widget-content ui-corner-all">Submit form above.</div>
<s:form id="formSelectTwo" action="echo" theme="simple" cssClass="yform">
<fieldset>
<legend>AJAX Form populated by a Map</legend>
<div class="type-text">
<label for="echo">Echo: </label>
<s:url id="remoteurl" action="jsonsample"/>
<sj:select
href="%{remoteurl}"
id="echo2"
name="echo"
list="languageMap"
emptyOption="true"
headerKey="-1"
headerValue="Please Select a Language"
/>
</div>
<div class="type-button">
<sj:submit
targets="result2"
value="AJAX Submit"
indicator="indicator"
button="true"
/>
<img id="indicator"
src="images/indicator.gif"
alt="Loading..." style="display:none"
/>
</div>
</fieldset>
</s:form>
<strong>Result Div 2 :</strong>
<div id="result2" class="result ui-widget-content ui-corner-all">Submit form above.</div>
<s:form id="formSelectThree" action="echo" theme="simple" cssClass="yform">
<fieldset>
<legend>AJAX Form populated by a List with Objects</legend>
<div class="type-text">
<label for="echo">Echo: </label>
<s:url id="remoteurl" action="jsonsample"/>
<sj:select
href="%{remoteurl}"
id="echo3"
name="echo"
list="languageObjList"
listKey="myKey"
listValue="myValue"
emptyOption="true"
headerKey="-1"
headerValue="Please Select a Language"
/>
</div>
<div class="type-button">
<sj:submit
targets="result3"
value="AJAX Submit"
indicator="indicator"
button="true"
/>
<img id="indicator"
src="images/indicator.gif"
alt="Loading..."
style="display:none"/>
</div>
</fieldset>
</s:form>
<strong>Result Div 3 :</strong>
<div id="result3" class="result ui-widget-content ui-corner-all">Submit form above.</div>
</body>
</html>
This example uses jsonsample2. There is a slight difference with the previous one here. The difference comes because of the levels. The second select has to be set according to the first selection. This is reflected in the JsonSample2.java code.
AjaxForms13.jsp
---------------
<%--
form example from the AJAX command section
--%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<html>
<head>
<sj:head/>
</head>
<body>
Reload example with two select boxes.
<s:form id="formSelectReload" action="echo" theme="simple" cssClass="yform">
<fieldset>
<legend>AJAX Form</legend>
<div class="type-text">
<label for="language">Language: </label>
<s:url id="remoteurl" action="jsonsample2"/>
<sj:select
href="%{remoteurl}"
id="language"
onChangeTopics="reloadsecondlist"
name="language"
list="languageObjList"
listKey="myKey"
listValue="myValue"
emptyOption="true"
headerKey="-1"
headerValue="Please Select a Language"
/>
</div>
<div class="type-text">
<label for="echo">Framework: </label>
<s:url id="remoteurl" action="jsonsample2"/>
<sj:select
href="%{remoteurl}"
id="selectWithReloadTopic"
formIds="formSelectReload"
reloadTopics="reloadsecondlist"
name="echo"
list="reloadList"
emptyOption="true"
headerKey="-1"
headerValue="Please Select a Framework"
/>
</div>
<div class="type-button">
<sj:submit
id="submitFormSelectReload"
targets="result"
value="AJAX Submit"
indicator="indicator"
button="true"
/>
<img id="indicator"
src="images/indicator.gif"
alt="Loading..."
style="display:none"
/>
</div>
</fieldset>
</s:form>
<br/>
Reload example with one select box and an buttonset.
<s:form id="formSelectCheckBox" action="echo" theme="xhtml">
<s:url id="remoteurl" action="jsonsample2"/>
<sj:select
href="%{remoteurl}"
id="languageSelect"
onChangeTopics="reloadcheckboxes"
name="language"
list="languageObjList"
listKey="myKey"
listValue="myValue"
emptyOption="true"
headerKey="-1"
headerValue="Please Select a Language"
label="Language"
required="true"
/>
<s:url id="remoteurl" action="jsonsample2"/>
<sj:checkboxlist
href="%{remoteurl}"
id="frameworkCheckboxes"
formIds="formSelectCheckBox"
reloadTopics="reloadcheckboxes"
name="echo"
list="reloadList"
label="Framework"
required="true"
onChangeTopics="submitCheckboxForm"
/>
<sj:submit
id="submitFormSelectCheckBox"
listenTopics="submitCheckboxForm"
targets="result"
value="AJAX Submit"
indicator="indicator2"
cssStyle="display : none;"
/>
</s:form>
<img id="indicator2"
src="images/indicator.gif"
alt="Loading..."
style="display:none"
/>
<strong>Result Div :</strong>
<div id="result" class="result ui-widget-content ui-corner-all">Submit a form.</div>
</body>
</html>
JsonSample2.java
----------------
/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied. See the License for the
* specific language governing permissions and limitations
* under the License.
*/
package ARS;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;
import com.opensymphony.xwork2.ActionSupport;
public class JsonSample2 extends ActionSupport {
private static final long serialVersionUID = -2223948287805083119L;
private static final Log log = LogFactory.getLog(JsonSample2.class);
private List<String> languageList;
private List<ListValue> languageObjList;
private Map<String, String> languageMap;
private List<String> reloadList;
private String language;
public String execute()
{
log.info("build json lists language : " + language);
languageList = new ArrayList<String>();
languageObjList = new ArrayList<ListValue>();
languageMap = new HashMap<String, String>();
languageList.add("Java");
languageList.add("PHP");
languageList.add("C#");
languageMap.put("J", "Java");
languageMap.put("P", "PHP");
languageMap.put("C", "C#");
languageObjList.add(new ListValue("J", "Java"));
languageObjList.add(new ListValue("P", "PHP"));
languageObjList.add(new ListValue("C", "C#"));
reloadList = new ArrayList<String>();
if (language != null && language.equalsIgnoreCase("J"))
{
reloadList.add("Struts2");
reloadList.add("MyFaces");
reloadList.add("Tapestry");
}
else if (language != null && language.equalsIgnoreCase("P"))
{
reloadList.add("CakePHP");
reloadList.add("Symfony");
reloadList.add("Zend");
}
else if (language != null && language.equalsIgnoreCase("C"))
{
reloadList.add("NStruts");
reloadList.add("ProMesh.NET");
reloadList.add("Websharp");
}
return SUCCESS;
}
public String getJSON()
{
return execute();
}
public List<String> getLanguageList()
{
return languageList;
}
public Map<String, String> getLanguageMap()
{
return languageMap;
}
public List<ListValue> getLanguageObjList()
{
return languageObjList;
}
public List<String> getReloadList()
{
return reloadList;
}
public void setLanguage(String language)
{
this.language = language;
}
}
ListValue.java
--------------
/**
*
*/
package ARS;
public class ListValue {
private String myKey;
private String myValue;
public ListValue(String myKey, String myValue) {
super();
this.myKey = myKey;
this.myValue = myValue;
}
public String getMyKey()
{
return myKey;
}
public void setMyKey(String myKey)
{
this.myKey = myKey;
}
public String getMyValue()
{
return myValue;
}
public void setMyValue(String myValue)
{
this.myValue = myValue;
}
}
You will find my technical articles and translations on software in this article. My areas of interest include JAVA - J2EE with all its aspects, specially EJB3, Struts, JSF, Spring, WebServices and other frameworks.
INFORMATION
Blog Archive
-
▼
2011
(61)
-
▼
March
(15)
- Struts2 JQuery AjaxFORMS-4
- Struts2 JQuery AjaxFORMS-3
- Struts2 JQuery AjaxFORMS-2
- Struts2 JQuery AjaxFORMS-1
- Struts2 - Jquery AJAX tutorial3
- Struts2 - Jquery AJAX tutorial2
- Struts2 - Jquery AJAX tutorial1
- Simple DAO Tutorial - 5
- Crud with JQuery Master-Detail 7
- Crud with JQuery Master-Detail 6
- Crud with JQuery Master-Detail 5
- Crud with JQuery Master-Detail 4
- Crud with JQuery Master-Detail 3
- Crud with JQuery Master-Detail 2
- Crud with JQuery Master-Detail 1
-
▼
March
(15)
About Me
- Air Traffic Control and Large Systems
- MSc Electronics and Telecommunication ITU, MM Music Theory and Composition Illinois State Uni, post grad studies ATC - FPP and Large Systems EUROCONTROL Uni ;-)..
