Select cascading based on JQuery implementation
- 2020-03-30 01:34:07
- OfStack
$(document).ready(function(){
$("#precinct").change(function(){
$("#ptype").val("");//Reset all
$("#stype").html("");
$("#stype").append("<option value="">-- Please select a --</option>");
});
<span style="white-space:pre"> </span>//Listen for the patent type change event
$("#ptype").change(function(){
var ptype = $(this);
var atype = $(this).val();//Object values
var pid = $("#precinct").val();
if (!ptype.data(atype)) {//You don't need to interact with the server to get the value from the cache
$.post("Main/PatentSubsidy/getSubsidy",{askfor:atype,precinct:pid},function(json){//Return json object
$("#stype").html("");//Empty <Span style="font-family: Arial, Helvetica, sans-serif;> # stype</ span> A drop-down box
for(var i=0;i<json.length;i++){
//Add a
$("#stype").append("<option value='"+json[i].id+"'>"+json[i].value+"</option>");
};
ptype.data(atype, json); //Adds a value of #ptype as key to the cache
},'json');
}else{
var json = ptype.data(atype);//Take the cache
$("#stype").html("");
for(var i=0;i<json.length;i++){
//Add a
$("#stype").append("<option value='"+json[i].id+"'>"+json[i].value+"</option>");
};
}
});
});
Get #stype by # precision and #ptype
The action method
public void getSubsidy(){
String askfor=null,precinct=null;
if(null!=getPara("askfor")&&!"".equals(getPara("askfor"))){
askfor=getPara("askfor");
if(null!=getPara("precinct")&&!"".equals(getPara("precinct"))){
precinct=getPara("precinct");
}
}else{
renderJson("[{"id":"","value":"-- Please select a --"}]");//Pass a null value and return
}
String sql = "select s.id, s.subsidy_type, p.name from org_subsidy_flow s, tab_precinct p where s.enabled = 'true' and p.status = '1' and s.patent_type = '" + askfor + "' and s.precinct = p.id";
if(null!=precinct&&!"".equals(precinct)){
sql += " and p.id = "+precinct;
}
sql += " order by p.id, s.id";
List<Org_subsidy_flow> sf = Org_subsidy_flow.dao.find(sql);
if(sf.size()!=0){
StringBuffer buffer = new StringBuffer();
for(int i=0;i<sf.size();i++){
buffer.append("{"id" : ""+sf.get(i).getInt("id")+"" , "value" : ""+sf.get(i).getStr("subsidy_type")+" -- "+sf.get(i).getStr("name")+""},");
}
if(buffer.length()!=0){
renderJson("["+buffer.substring(0, buffer.length()-1).toString()+"]");
}
}else{
renderJson("[{"id":"","value":"-- Please select a --"}]");
}
}