Populate dropdown2 based on the selection of dropdown1 in java spring annotation

Question

Java Code Contains the following:

@ModelAttribute("countries")
public List<Country> initializeCountries() {

    List <Country> countries = countryService.findAllCountrys();

    return countries;
}  

I have populated country successfully using the following code:

<form:select path="country" id="country">
    <form:option value="">Select Country</form:option>
    <form:options items="${countries}" itemValue="countryCode" itemLabel 
     = "countryName" />
</form:select>
<form:errors path="country" cssClass="error"/> 

I have the following code which fetches states based on countryCode:

List <State> states = countryService.findAllStatesOfCountry(countryCode);

How should I write the java code and jsp code to populate the state dropdown list based on the selection of country. Is there any other way without using Ajax/javascript in spring annotation? Trying to find this option.

If not kindly mention the full details since I tried my level best with Ajax. I am new to Ajax and hence please share maven dependencies, js and css files to be loaded into the jsp file.

Answer 1

It can be achieved without using ajax(although using ajax/javascript is preferred here).

 <script language="javascript">
     function getStates(selectedCountry)
     {
    window.location.href='/getStates?country='+selectedCountry; 
     }

     </script>

<form:select path="country" id="country">
    <form:option value="">Select Country</form:option>
    <form:options items="${countries}" itemValue="countryCode" itemLabel 
     = "countryName" onchange="javascript:getStates(this.value)"/>
</form:select>

    <form:select path="state" id="state">
        <form:option value="">Select State</form:option>
<c:if test="${not empty states}" >
        <form:options items="${states}" itemValue="stateCode" itemLabel 
         = "stateName"/>
</c:if>
    </form:select>

• onchange attribute is added to javascript function call. It will take the selected country value and pass it to a controller with a request parameter as country. So, on changing the country, a server call will be made to fetch the states for the given country and the page will be refreshed.
• A new dropdown for states is added with c:if so that state drop down is populated only when the attribute states is present in the request.

On the controller side, you will have write something as follows

    @RequestMapping("/getStates")
        public ModelAndView getStates(@RequestParam("country")String countryCode){
       ModelAndView mv = new ModelAndView("yourCurrentView");     
List<States> states = stateService.findAllStatesOfCountry(countryCode);
    mv.add("states",states);
    //to make sure countries drop down also has data
    mv.add("countries",countries);
    }