Win a copy of Design for the Mind this week in the Design forum!
    Bookmark Topic Watch Topic
  • New Topic

Dynamic Population of Drop Down List using AJAX

 
Kunal Sathe
Ranch Hand
Posts: 49
  • Mark post as helpful
  • send pies
  • Report post to moderator
Hello All,
I am very new to AJAX and am trying to use it in a web application that I am working on. I need some guidance from the experts.

Here is the scenario:

Initially, the user logs onto the application and goes to the product selection screen.

The product selection screen has two drop downs, one for the Carrier ID and the other for Product Name.

I would like to use AJAX to dynamically populate the Product Name drop down list depending upon the Carrier ID selected by the user.

How can this be done in AJAX? I would really appreciate if someone can point me in the right direction.

Thanks in advance.

Regards,
Kunal


Here is my JSP with some AJAX code in it. I am still working on it and have not completed it. So, any help will be highly appreciated.

 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64698
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Report post to moderator
I didn't take a close look at your code -- looking at a bunch of Struts tags is less than illuminating -- but the premise of the dependent drowdown is fairly easy.

1. When a selection is made from dropdown #1, an Ajax request is made to a server-side resource with the value chosen.
2. Using that value, the server-side resource collects and returns the list of values that are to become the options of dropdown #2. I usually employ JSON for this purpose as it's easy to digest on the client.
3. The client handler for the request converts the JSON to a Javascript construct and uses the information to add the options to dropdown #2.

A cursory look at your code reveals that you are doing all the Ajax stuff directly. That's madness in my opinion. Better to get acquainted with one of the toolkits that vastly simplifies the process by masking browser dependencies and that handle the ready-change protocol. I'm partial to Prototype and jQuery myself.
 
Kunal Sathe
Ranch Hand
Posts: 49
  • Mark post as helpful
  • send pies
  • Report post to moderator
Thanks Bear. I shall implement your suggestions and let you know.
 
Hussein Baghdadi
clojure forum advocate
Bartender
Posts: 3479
Clojure Mac Objective C
  • Mark post as helpful
  • send pies
  • Report post to moderator
May I suggest you check Ajax.Autocompleter ?
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64698
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Report post to moderator
That's not really the same thing.
 
Kunal Sathe
Ranch Hand
Posts: 49
  • Mark post as helpful
  • send pies
  • Report post to moderator
Hello Bear,

What should be the url that we send to the server side?

Regards,
Kunal
 
Kunal Sathe
Ranch Hand
Posts: 49
  • Mark post as helpful
  • send pies
  • Report post to moderator
In the above code, the url is:



Should PopulateExamList be an entry in the struts-config file
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64698
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Report post to moderator
If you want to implement your resource as a Struts Action, then you would address it just like any other action. The difference would be in what the Action returns as the response. Instead of a full HTML page, the response would be the text of a JSON construct or an XML document or however else you decide to return the option data to the client.
 
Kunal Sathe
Ranch Hand
Posts: 49
  • Mark post as helpful
  • send pies
  • Report post to moderator
Hey Bear,

The following is what I am trying to do. Please let me know if I am headed in the right direction.

From the Javascript in the JSP Page, i am calling the retrieveURL method where I am passing the Struts Entry as shown below



I have a Struts Entry as follows in the Struts Config file



The control is flowing to the ShowAjaxAction class. Should I be creating a JSON Object in the ShowAction class? Also how do I pass it to the JSP and how do I use it in the JSP page.

Any comment will be highly appreciated.

Regards,
Kunal
 
Kunal Sathe
Ranch Hand
Posts: 49
  • Mark post as helpful
  • send pies
  • Report post to moderator
Thanks for your help Bear!


I have been successfully implemented the solution.

I used the following link as a reference.

Hope this is helpful to somebody else as well.


http://today.java.net/pub/a/today/2005/10/27/sprinkle-ajax-magic-into-struts-webapp.html


Regards,
Kunal
 
Deepak Lal
Ranch Hand
Posts: 561
Eclipse IDE Java
  • Mark post as helpful
  • send pies
  • Report post to moderator
Hi Kunal Sathe and Bear ,
Could you please help me with this issue.Im facing the same problem

"I would like to use AJAX to dynamically populate the Product Name drop down list depending upon the Carrier ID selected by the user. "

Can you please post the workable code,so that we can use it for reference.

Thanks
Deepak
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64698
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Report post to moderator
Rather than posting to an old topic, please start a new one with your question.

And here are a few tips:

  • Include your code -- no one is going to qrite code for you
  • Use code tags to post code
  • Use color sparingly and only for emphasis

  •  
      Bookmark Topic Watch Topic
    • New Topic