First Drop-down Box:
Copy Code code as follows:
<select id= "Select" Name= "Rawfoodbasic.category" onchange= "Dochange (this.value);" >
The value in the first Drop-down box
</select>
The second Drop-down box:
Copy Code code as follows:
<select id= "Subselect" name= "Rawfoodbasic.absorb" onchange= "Javascript:alert" (This.value); ">/ To 3 and the menu can also be written at the appropriate time
<option value= "0" >--Please select level two menu--</option>
</select>
JS Code:
Copy Code code as follows:
<script type= "Text/javascript" >
$.ajaxsetup ({
Cache:false
}); Clear the previous values in Ajax
function Dochange (obj) {
var url = ' <c:url value= '/nutrition/getsubdictdatatojsonbycategory.action '/> ' + ' rawfood.category= ' +obj;// The first Drop-down box is selected and entered in the Action,action to assign the value required for the second Drop-down box
$.getjson (Url,function (JSON) {
var Seleojb=document.getelementbyid ("Subselect");
for (Var k=0;k<seleojb.options.length;k++) {
SeleOjb.options.remove (k); When you select the value in the first Drop-down box, clear the original value from the second Drop-down box
}
$.each (Json.subcategorydictlist,function (index,subdictdata) {
var optionj=document.createelement ("option"); Assign a value to the second Drop-down box
Optionj.value = subdictdata.id;
alert (subdictdata.id);
Optionj.text=subdictdata.name;
Seleojb.add (OPTIONJ);
});
});
}
</script>
Copy Code code as follows:
<action name= "getsubdictdatatojsonbycategory" class= "Rawfoodaction" method= "Getsubdictdatatojsonbycategory" >
<result name= "Success" type= "JSON" >
<param name= " Includeproperties ">//define returned parameters
^subcategorydictlist\[\d+\]\.id,
^subcategorydictlist\[\d+\]\.name
& Lt;/param>
</result>
</action>
