Struts 2 - AJAX Drop down Example


Struts2 AJAX Drop down Example, struts2 ajax auto populate drop down, struts2 ajax auto select drop down, Struts2 AJAX Example, Struts2 AJAX Drop down sample Code, Struts 2, beginners example for struts2, struts2 simple application,struts2 with ajax
Struts 2 is a powerful Web Application Development framework. Its built on top of WebWork framework and rebranded as Struts 2. Due to excessive popularity of Struts 1 its difficult to search for much relevant documentation on web about struts2. Slowly the search engines are improving on that.

In this example when you select from one drop down the other will populate accordingly. You can use it as is or play around with it based on your need


Index.jsp
<%@ taglib prefix="s" uri="/struts-tags" %>


Listing.jsp
<%@ taglib prefix="s"  uri="/struts-tags"%>
    <html>
     <head>
    <s:head theme="ajax"  />
     <title>Listing</title>
     </head>
    <script>
     function show_details() {
     dojo.event.topic.publish("show_detail");
     }
    </script>
     <body>
    <s:form id="frm_demo" name="frm_demo"  theme="simple">
    <table  border="0">
    <tr>
     <td><s:select list="lstList1" name="lst"
     onchange="javascript:show_details();return false;"  ></s:select>
    </td>
     <td><s:url id="d_url" action="DetailAction" /> <s:div  showLoadingText="false"
    id="details" href="%{d_url}"  theme="ajax"
    listenTopics="show_detail"  formId="frm_demo">
     </s:div></td>
     </tr>
    </table>
     </s:form>
    </body>
     </html>


Detail.jsp
<%@ taglib prefix="s" uri="/struts-tags"%>




DetailAction.java
package ajaxdemo.action;

import java.util.ArrayList;
import java.util.List;

import com.opensymphony.xwork2.ActionSupport;

public class DetailAction extends ActionSupport {
private String lst;
private List lstList = null;
private List lstList2 = null;

public String execute() throws Exception {

if (getLst() != null && !getLst().equals("")) {
populateDetail(getLst());
return SUCCESS;
} else {
return SUCCESS;
}
}

private void populateDetail(String id) {
lstList = new ArrayList();
if (id.equalsIgnoreCase("Fruits")) {
lstList.add("Apple");
lstList.add("PineApple");
lstList.add("Mango");
lstList.add("Banana");
lstList.add("Grapes");
} else if (id.equalsIgnoreCase("Places")) {
lstList.add("New York");
lstList.add("Sydney");
lstList.add("California");
lstList.add("Switzerland");
lstList.add("Paris");
} else {
lstList.add("Other 1");
lstList.add("Other 2");
lstList.add("Other 3");
lstList.add("Other 4");
lstList.add("Other 5");
}
}

public List getLstList() {
return lstList;
}

public void setLstList(List lstList) {
this.lstList = lstList;
}

public String getLst() {
return lst;
}

public void setLst(String lst) {
this.lst= lst;
}
}


DetailListing.java

package ajaxdemo.action;

import com.opensymphony.xwork2.ActionSupport;
import java.util.ArrayList;
import java.util.List;

public class ListingAction extends ActionSupport {
private List lstList1 = null;

public String execute() throws Exception {
populateDetail();
return SUCCESS;
}

private void populateDetail() {
lstList1 = new ArrayList();
lstList1.add("Fruits");
lstList1.add("Places");
lstList1.add("Others");

}

public List getLstList1() {
return lstList1;
}

public void setLstList1(List lstList1) {
this.lstList1 = lstList1;
}
}


Struts.xml

<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">



/listing.jsp

/detail.jsp 


web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">

struts2
org.apache.struts2.dispatcher.FilterDispatcher

struts2
/*

index.jsp
 

Post a Comment Default Comments

  1. Really useful examples....do u have some code snippet for DOJO AJAX calls...

    ReplyDelete
  2. Hi,
    I tried it but it goes into infinite loop and finally the browser hangs :(

    ReplyDelete
  3. As Ajax UI tags were moved to the new dojo plugin, Use uri="/struts-dojo-tags" instead of uri="/struts-tags"

    ReplyDelete
  4. hey with out Ajax can ve create dropdown list in struts2??
    Is it possible??
    If s,tell me the code plss???

    ReplyDelete
  5. Yes, you can always create a list without using AJAX. The first list in this example does not require AJAX call. This example demonstrates how you can get the values in another drop down when one option is selected. Let me know what exactly you are looking for?

    ReplyDelete
  6. @joel Struts2 is a web based application framework and requires you to have a JEE server like Tomcat or Glassfish. you can download it from web and deploy your web application. You may want to read more about the JEE fundamentals before you get into this framework.

    ReplyDelete
  7. I am getting error like dojo is not defined. Can anybody help ?

    ReplyDelete
  8. @Anonymous -

    1. can you post the exact error from the logs please.
    2. Which version of Struts2 are you using?

    Let me know and I will try to resolve the issue for you.

    ReplyDelete
  9. Do you have struts2-dojo-plugin-*.jar in you app/WEB-INF/lib directory? For dojo plugin to work this jar needs to be in your application CLASSPATH.

    ReplyDelete
  10. dojo.event.topic.publish("show_detail");
    giving an error as the function publish(string)is undefine........

    plz anyone help me....

    ReplyDelete
  11. 1. which version of Struts2 you are using?

    2. Do you have struts2-dojo-plugin-*.jar in you app/WEB-INF/lib directory? For dojo plugin to work this jar needs to be in your application CLASSPATH.

    Let me know and I will try to help you debug this.

    ReplyDelete
  12. i am quite new to /struts-dojo-tags, can you please tell me how the two combo box communicate with each other. For example on the select of one combo box how other combo box populate object.

    ReplyDelete
  13. hi
    it is a nice posting,I have requirement to use ajax in my application,from the jsp i need to make a ajax call to the action class which inturn take the request from the ajax query string and check with the database and should return a result set to the jsp page or ajax response.can any body help me on this.thanks in advance

    ReplyDelete
  14. @Anonymous - This example talks about a similar problem. These are the things you need to do

    1. Replace the onchange event logic to a specific event you want AJAX call to be triggered on.

    2. Add database call and data population in the populateDetail() method in DetailAction.java.

    Let me know if this helps.

    ReplyDelete
  15. yes this helped me in fixing the issue.
    Thanks for your advise

    ReplyDelete
  16. hi I have problem with struts 2 validator framework.when I am using that for my loginAction it is working fine,when I am using in other action which has the float datatype feilds I am having a problem.i did use the required validation on float feild it is saying me that it is a required feild but before that i am getting an alert box saying Object ERR.if I say ok then it is displaying a message XXX feild is required.please any help is appriciated
    Thanks in advance

    ReplyDelete
  17. @Anonymous - I need to see the code before I can suggest anything. Please let me know the content of config files and Struts action classes.

    I am assuming you are using Struts 2.

    Also checkout this post about struts validation Struts 2 Integer Validation

    ReplyDelete
  18. Hi,

    I am getting the first list to show up but the second list is not showing up. I am using struts 2.1.8.1.

    ReplyDelete
  19. This example uses Struts 2.0, and there has been significant changes in Struts 2.1.8.1.

    Try to browse through the showcase application of Struts 2.1.8.1

    ReplyDelete
  20. Any example that works with jQuery?

    ReplyDelete
  21. in the struts2 jquery plugin wiki you can find an example for ajax based drop down.

    http://code.google.com/p/struts2-jquery/wiki/SelectTag#A_simple_Doubleselect_with_Topics

    also in the showcase under "Ajax Forms" are some examples for this task.

    ReplyDelete
  22. Is it possible to return the list to same jsp page , instaed of craeting a new jsp

    ReplyDelete
  23. @Developer - not sure if I understood your question. In Detail.jsp the response to list selection is being rendered, but the data would still be displayed on same page since we are using AJAX call.

    ReplyDelete
  24. Hi guys...

    I got the sample working, but when i include a button and pass the selected values from select boxes to another page, only the values from the first select box is displayed and not the one i selected in the second select box. this becomes a problem when i have to include third select box which i need populate based on the second one. can anyone help me on this problem?

    ReplyDelete
  25. @Arun - Looks like you are looking for another event. Try creating another event and use a JS function to publish it when the second text box changes. This is just an example code, I think you need understand more in depth details of how dojo framework event publishing works.

    Try looking at some sample code/documents for DOJO

    ReplyDelete
  26. Hi
    Here my value is getting refreshed when i submit
    the form. How to hold the value on submit.

    Thanks for your valuable inputs.

    ReplyDelete
  27. I have an html table that add rows dynamically on a button click if you need to enter more data. Each cell contain a link to display a combo box that contain some values from database. Whenever i select a value from combo how this value will display its corresponding cell?. whenever i repeat the previous case in second cell,the first cell will be refreshed. How can prevent it?

    ReplyDelete
  28. First of all thanks for this best example bro, I have use the same scenario to implement my functionality for multiple select for country,state and city but i cant get the result displayed in although my action is performed very well.

    Please reply....

    ReplyDelete
    Replies
    1. What is the version of struts you are using? Also share the error logs you are seeing in server.

      Delete
  29. Hi..If you want to replace some part of jsp using div means, what should I use?? mean Ajax processing

    ReplyDelete
    Replies
    1. This could be done using simple jQuery like client side library. You can replace any part of existing DOM object using jQuery methods.

      Delete
  30. Hi,while validating form fields,ajax populating fields does not populating.

    ReplyDelete
  31. dojo.event is undefined. What could be the reason ?

    ReplyDelete
    Replies
    1. Use uri="/struts-dojo-tags" instead of uri="/struts-tags" The dojo libraries location has been moved since.

      Delete
    2. but how to access dynamically generated value in action class,since code generated for is-
      < dojoType="struts:BindDiv"
      id="details" formId="form_invoice" href="/struts2HelloWorld/invoiceClientDetailAction.action" listenTopics="show_detail" showError="true" showLoading="false">


      Delete
    3. I need the same application with JQuery....................
      can you post it tomorrow.....

      please its urgent.....

      Delete
  32. Here you are populating drop down list whose code is written in some other page Detail.jsp... is it possible if i want to have the code of detail.jsp in same page as listing.jsp and then populate list?? i tried doing that but i am getting errors

    ReplyDelete
  33. I have implemented same idea in which list is populated from database.
    in this i m facing problem to connect frist drop to second drop down list.
    can u guide me..

    ReplyDelete
  34. Im having trouble with execute Javascript code in the fetched content from AJAX using Struts2 dojo 2.3.4.1, I've been using executeScript and separateScripts.

    ReplyDelete

Individuals who comment on FromDev at regular basis, will be rewarded in Top Commenter section. (Comments are selectively moderated so please do not spam)

emo-but-icon

...

item