省市县三级联动
程序员文章站
2024-03-14 20:28:28
...
在controller层写
@RequestMapping("add")
public String add(Shop shop,HttpServletRequest request){
String address[] = shop.getAddress().split(",");
String dizhi = "";
for(String s : address){
String sname = mService.getBySanId(s);
dizhi = dizhi+","+sname;
}
shop.setAddress(dizhi);
mService.add(shop);
return "redirect:list.action";
}
@RequestMapping("getSanji")
@ResponseBody
public List<Sanji> getSanji(String pid){
if (pid==null) {
pid="0";
}
return mService.getSanji(pid);
}
前台ajax
$.post(
"getSanji.action",
function(obj){
for (var i = 0; i < obj.length; i++) {
$("#sheng").append("<option value="+obj[i].id+">"+obj[i].name+"</option>");
}
},
"json"
)
$("#sheng").change(function() {
$("#shi").empty();
$("#shi").append("<option value='0'>请选择</option>");
$("#xian").empty();
$("#xian").append("<option value='0'>请选择</option>");
var pid=$("#sheng").val();
if (pid!=0) {
$.post(
"getSanji.action",
{pid:pid},
function(array) {
for (var i = 0; i < array.length; i++) {
$("#shi").append("<option value ="+array[i].id+">"+array[i].name+"</option>");
}
},
"json"
)
}
})
$("#shi").change(function() {
$("#xian").empty();
$("#xian").append("<option value='0'>请选择</option>");
var pid=$("#shi").val();
if (pid!=0) {
$.post(
"getSanji.action",
{pid:pid},
function(array) {
for (var i = 0; i < array.length; i++) {
$("#xian").append("<option value ="+array[i].id+">"+array[i].name+"</option>");
}
},
"json"
)
}
})
$("#xian").change(function(){
var spid=$("#sheng").val();
var shipid=$("#shi").val();
var xpid=$("#xian").val();
var pid=[];
pid.push(spid);
pid.push(shipid);
pid.push(xpid);
alert(pid);
$("[name=address]").val(pid.join());
})
})
下拉框
<div class="form-group">
<div class="col-xs-4">
<label for="exampleInputPassword1">供应商位置</label>
<input name="address" type="hidden" class="form-control" id="exampleInputPassword1" >
<select id="sheng">
<option>请选择</option>
</select>
<select id="shi">
<option>请选择</option>
</select>
<select id="xian">
<option>请选择</option>
</select>
</div>
</div>
数据库
CREATE TABLE `sanji` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`name` varchar(255) DEFAULT NULL,
`pid` int(11) DEFAULT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=24 DEFAULT CHARSET=utf8;
INSERT INTO `sanji` VALUES ('1', '北京', '0');
INSERT INTO `sanji` VALUES ('2', '山西', '0');
INSERT INTO `sanji` VALUES ('3', '河北', '0');
INSERT INTO `sanji` VALUES ('4', '河南', '0');
INSERT INTO `sanji` VALUES ('5', '山东', '0');
INSERT INTO `sanji` VALUES ('6', '海淀', '1');
INSERT INTO `sanji` VALUES ('7', '昌平', '1');
INSERT INTO `sanji` VALUES ('8', '丰台', '1');
INSERT INTO `sanji` VALUES ('9', '中关村', '6');
INSERT INTO `sanji` VALUES ('10', '西关环岛', '7');
INSERT INTO `sanji` VALUES ('11', '科技园', '8');
INSERT INTO `sanji` VALUES ('12', '太原', '2');
INSERT INTO `sanji` VALUES ('13', '吕梁', '2');
INSERT INTO `sanji` VALUES ('14', '小店', '12');
INSERT INTO `sanji` VALUES ('15', '尖草坪', '12');
INSERT INTO `sanji` VALUES ('16', '临县', '13');
INSERT INTO `sanji` VALUES ('17', '方山', '13');
INSERT INTO `sanji` VALUES ('18', '菏泽', '5');
INSERT INTO `sanji` VALUES ('19', '曹县', '18');
INSERT INTO `sanji` VALUES ('20', '石家庄', '3');
INSERT INTO `sanji` VALUES ('21', '新华区', '20');
INSERT INTO `sanji` VALUES ('22', '邓州', '4');
INSERT INTO `sanji` VALUES ('23', '镇平县', '22');
要实现效果
上一篇: 城市三级联动
下一篇: Pycharm关于mxnet使用错误