实现效果:
步骤一:自定义查询
package wht.customer.mapper;
import com.hand.hap.mybatis.common.Mapper;
import wht.customer.dto.BaseAddressName;
import java.util.List;
public interface BaseAddressNameMapper extends Mapper{
/**
* 联级查询
* @param dto
* @return
*/
List getAddressByType(BaseAddressName dto);
}
package wht.customer.service;
import com.hand.hap.core.ProxySelf;
import com.hand.hap.system.service.IBaseService;
import wht.customer.dto.BaseAddressName;
import java.util.List;
public interface IBaseAddressNameService extends IBaseService, ProxySelf {
/**
* 联级查询
* @param dto
* @return
*/
List getAddressByType(BaseAddressName dto);
}
package wht.customer.service.impl;
import com.hand.hap.system.service.impl.BaseServiceImpl;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import wht.customer.dto.BaseAddressName;
import wht.customer.mapper.BaseAddressNameMapper;
import wht.customer.service.IBaseAddressNameService;
import org.springframework.transaction.annotation.Transactional;
import java.util.List;
@Service
@Transactional(rollbackFor = Exception.class)
public class BaseAddressNameServiceImpl extends BaseServiceImpl implements IBaseAddressNameService {
@Autowired
private BaseAddressNameMapper mapper;
/**
* 省份联级查询
*
* @return
*/
@Override
public List getAddressByType(BaseAddressName dto) {
return mapper.getAddressByType(dto);
}
}
注意传递的参数
/**
* 联级查询
*
* @param request
* @param type
* @return
*/
@RequestMapping(value = "/hcrm/base/customer/getAddressByType")
@ResponseBody
public List getAddressByType(HttpServletRequest request, @RequestParam("type") String type,@RequestParam("parentAddressId") Long parentAddressId) {
System.out.println("===" + type);
System.out.println("===" + parentAddressId);
BaseAddressName baseAddressName=new BaseAddressName();
baseAddressName.setType(type);
baseAddressName.setParentAddressId(parentAddressId);
IRequest iRequest = createRequestContext(request);
ResponseData responseData = new ResponseData();
List list = new ArrayList<>();
try {
list = service.getAddressByType(baseAddressName);
} catch (Exception e) {
responseData.setSuccess(false);
responseData.setMessage(e.getMessage());
}
for(BaseAddressName addressName:list){
System.out.println(addressName.getType()+addressName.getAddressName()+addressName.getParentAddressId());
}
return list;
}
js文件,这里从数据库中查找数据
//页面加载完成后
$(function () {
countryDownload();
})
/**
* 国家
*/
function countryDownload() {
$("#addressProvince").empty();
$("#addressCity").empty();
$("#addressZone").empty();
$.ajax({
url: '/hcrm/base/customer/getAddressByType?type=COUNTRY&parentAddressId=0',
type: 'POST',
dataType: "json",
contentType: "application/json",
success: function (result) {
/*获取控件元素,并向元素加值*/
var sel = document.getElementById("addressCountry");
for (var i in result) {
var id = result[i].addressId;
var name = result[i].addressName;
console.log("result" + result[i].addressName);
var option = new Option(name, id);
sel.options.add(option);
}
}
});
}
/**
* 省份
*/
function provinceDownload() {
var addressCountry = $("#addressCountry").val();
$("#addressProvince").empty();
$("#addressCity").empty();
$("#addressZone").empty();
console.log("addressCountry:" + addressCountry);
$.ajax({
url: '/hcrm/base/customer/getAddressByType?type=PROVINCE&parentAddressId=' + addressCountry,
type: 'POST',
dataType: "json",
contentType: "application/json",
success: function (result) {
var sel = document.getElementById("addressProvince");
for (var i in result) {
var id = result[i].addressId;
var name = result[i].addressName;
console.log("result" + result[i].addressName);
var option = new Option(name, id);
sel.options.add(option);
}
}
});
}
/**
* 城市
*/
function cityDownload() {
var addressProvince = $("#addressProvince").val();
$("#addressCity").empty();
$("#addressZone").empty();
console.log("addressProvince:" + addressProvince);
$.ajax({
url: '/hcrm/base/customer/getAddressByType?type=CITY&parentAddressId=' + addressProvince,
type: 'POST',
dataType: "json",
contentType: "application/json",
success: function (result) {
var sel = document.getElementById("addressCity");
for (var i in result) {
var id = result[i].addressId;
var name = result[i].addressName;
console.log("result" + result[i].addressName);
var option = new Option(name, id);
sel.options.add(option);
}
}
});
}
/**
* 县区
*/
function zoneDownload() {
var addressCity = $("#addressCity").val();
$("#addressZone").empty();
console.log("addressCity:" + addressCity);
$.ajax({
url: '/hcrm/base/customer/getAddressByType?type=AREA&parentAddressId=' + addressCity,
type: 'POST',
dataType: "json",
contentType: "application/json",
success: function (result) {
var sel = document.getElementById("addressZone");
for (var i in result) {
var id = result[i].addressId;
var name = result[i].addressName;
console.log("result" + result[i].addressName);
var option = new Option(name, id);
sel.options.add(option);
}
}
});
}
页面代码 记得在script调用这个 countryDownload();
注意:在插入数据库的时候这样绑定值,不能用之前的
$("#saveGrid").click(function () {
//绑定数据:viewModel.model.set("",$("#addressProvince").val())
/* 方法二:*/
if (document.getElementById("addressCountry").selectedIndex>-1) {
alert("addressCountry"+document.getElementById("addressCountry").selectedIndex)
viewModel.model.set("addressCountry", document.getElementById("addressCountry").options[document.getElementById("addressCountry").selectedIndex].text);
}
if (document.getElementById("addressProvince").selectedIndex>-1) {
alert("addressProvince"+document.getElementById("addressProvince").selectedIndex)
viewModel.model.set("addressProvince", document.getElementById("addressProvince").options[document.getElementById("addressProvince").selectedIndex].text);
}
if (document.getElementById("addressCity").selectedIndex>-1) {
alert("addressCity"+document.getElementById("addressCity").selectedIndex)
viewModel.model.set("addressCity", document.getElementById("addressCity").options[document.getElementById("addressCity").selectedIndex].text);
}
if (document.getElementById("addressZone").selectedIndex>-1) {
alert("addressZone"+document.getElementById("addressZone").selectedIndex)
viewModel.model.set("addressZone", document.getElementById("addressZone").options[document.getElementById("addressZone").selectedIndex].text);
}
viewModel.model.__status = 'add';
Hap.submitForm({
url: '${base.contextPath}/hcrm/customer/submit',
formModel: viewModel.model,
grid: {"productList": $("#productGrid"), "contactList": $("#contactGrid")},
success: function (data) {
alert("成功");
}
});
});
鸣谢:森林兄
https://zhidao.baidu.com/question/365648658275520852.html?qbl=relate_question_0&word=html%20%BB%F1%C8%A1select%B5%C4%D1%A1%CF%EE%C3%FB%B3%C6name