Ajax multiple selects struts 2

I have several Ajax Selects in a form on a struts 2 page.

If the country is changed then the city select is repopulated using an Ajax call. This is working fine.

I have the same thing when the city is changed then the building list is repopulated. This also works fine.

My problem now is that when I change the Country, The city list is repopulated, but the building list is not. So the list of buildings is not relevant to the new list of cities(city selected by default). If I change the country, How can I reload the buildings based on what would be selected by default from the new city list. I basically need to chain these list repopulations.

Any ideas????


Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

You can basically nest the AJAX calls; that is in your function call the Ajax function to populate the building list for each new city loaded.

But this defeats the very purpose of using Ajax, as you are pre-empting the whole data. What I would suggest is to clear the data in the building list when you change country. This would imply that there is no stale data if you view the building list and it will always be re-populated when you select any city.

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
spunogAuthor Commented:
Hi Thanks for your reply. I'm not sure I understand you. I dont have an ajax function as such. This is with struts 2. In my select tag I simply have onchange="javascript:dojo.event.topic.publish('reload_buildings');return false;" there is a div listening for this event and the ajax Action result gets written into the div.

I'm not sure how I can clear another list while doing this.

Also I have a single div for each select.


On change of country, you can call a JavaScript function and then call your city refresh dojo function. Something like below

function changeCountry(selectedValue){
      var select = document.getElementById("buildings");
      select.options.length = 0;      
        //assuming you would do this on change on country
       return false;

The country select tag will call this function

<select id='country' onChange="javascript:changeCountry(this.value)">
Cloud Class® Course: C++ 11 Fundamentals

This course will introduce you to C++ 11 and teach you about syntax fundamentals.

spunogAuthor Commented:
Cool That looks good enough.

One other thing though. What about when the cities are reloaded, buildings are set to size zero, what if the default city is the city that the user actually wants, then they would expect the buildings to contain the buildings of the default city but now the buildings will be blank. In this scenario the user would need to change to another city and then change back to the previous default city in order to see the correct buildings for that city.

spunogAuthor Commented:
Maybe I could put a little refresh icon beside each drop down. It would reload the drop down based on the parent selection. It wouldnt be ideal though.
Hmm..you can select the city by setting the selected index of the city drop-down and my guess is that it should fire the Ajax call.

The other thing that you could do is add an option called "Select 1" as the first in the city dropdown and have it selected by default when you load. Voilda, the user HAS to select!!
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Java EE

From novice to tech pro — start learning today.