SpringMVC之ajax+select下拉框交互常用方式
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="../js/jquery-1.8.0.min.js"></script>
<script> //ajax+select三种常用交互方式
window.onload=function(){
test();
}
function test(){ alert("执行"); var start = 0;
var size=100;
var headNo = "111111";
$.ajax({
type : "post",
url : "/ssm_pms/admin_group/list", //此次url改为真正需要的url
data : {"headNo":headNo,
"start":start,
"size":size
},
dataType : 'json',
success : function(data) {
loadData(data.hotelChainList);
},error:function(){
alert("error");
}
}); var loadData=function(list){
for (var i = 0; i < list.length; i++) { $("#hotelNo").append("<option value="+list[i].hotels[0].hotelNo+">"+list[i].hotels[0].hotelName+"</option>")
}
}
/* $.ajax({
type : "post",
url : "/ssm_pms/admin_group/list", //此次url改为真正需要的url
data : {"headNo":headNo,
"start":start,
"size":size
},
dataType : 'json',
success : function(data) {
$.each(data.hotelChainList, function(index, item) {
$("#hotelNo").append( //此处向select中循环绑定数据
"<option value="+item.hotels[0].hotelNo+">" + item.hotels[0].hotelName+ "</option>");
});
},
}); */
/* $.ajax({
type : "post",
url :"/ssm_pms/admin_group/list", //此次url改为真正需要的url
data : {"headNo":headNo,
"start":start,
"size":size
},
dataType : 'json',
success : function(data) {
alert(data.returnMsg);
var list = data.hotelChainList;
for (var i = 0; i < list.length; i++) {
alert(list[i].hotels[0].hotelNo)
$("#hotelNo").append("<option value='1'>"+list[i].hotels[0].hotelName+"</option>")
} },error:function(){
alert("error");
}
}); */
}
</script>
</head>
<body> <select id="hotelNo">
<option>请选择酒店</option>
</select>
</body>
</html>
上述三种方式，本人亲试有效，这个是比较常用的，特别是前后端交互，就拿酒店管理系统而言，部门员工等就涉及到下拉框联动，当然还有很多应用场景。
后台代码为Java代码，SpringMVC，这是web层框架，也是现在比较常用的，非常有名的。
SpringMVC代码为:
/**
* 查询集团下酒店店长信息及其角色信息
* @param start
* @param size
* @param headNo
* @param map
* @return
*/
@PostMapping(value="managerList",produces="application/json;charset=utf-8")
@ResponseBody
public String managerList(Integer start,Integer size,String headNo,Map<String,Object> map) { //角色编号为3 店长
String roleNo="3";
map.put("headNo", headNo);
map.put("roleNo", roleNo);
map.put("start", start);
map.put("size", size); //调用查询集团下酒店店长信息及其角色信息集合方法
List<HotelChain> hotelChainList = hotelChainService.selectManagerInfoList(map);
int lines = hotelChainService.selectManagerCount(map); //调用查询集团下酒店店长信息及其角色信息总数方法
Map<String,Object> returnMap = new HashMap<String,Object>(); //根据判断结果返回不同结果集
if(lines!=0 && hotelChainList.size()!=0) {
returnMap.put("hotelChainList", hotelChainList);
returnMap.put("lines", lines);
returnMap.put("returnCode", "000000");
returnMap.put("returnMsg", "获取到数据");
}else {
returnMap.put("returnCode", "111111");
returnMap.put("returnMsg", "没有获取到数据");
} return JSON.toJSONString(returnMap);
}
SpringMVC之ajax+select下拉框交互常用方式的更多相关文章
- 非常实用的select下拉框-Select2.js
在Web开发中,Select下拉框是常用的输入组件.由于原生的Select几乎很难通过CSS样式控制.一些好看的Select下拉框就只能通过模拟来实现.PHP程序员雷雪松给大家推荐一筐款不错的Sele ...
- 在element-ui的select下拉框加上滚动加载
在项目中,我们需要运用到很多来自后端返回的数据.有时是上百条,有时甚至上千条.如果加上后端的多表查询或者数据量过大,这就导致在前端的显示就会及其慢,特别是在网络不好的时候更是如此. 自然,后端就做了一 ...
- select下拉框之默认选项清空
最近和小伙伴发现,select默认选项一般是提示信息,怎么才能让当我们点击下拉框时,可选的选项中没有默认的提示信息呢? 思路: 1.当点击下拉框时,让默认提示信息,即下拉框第一个选项移除. 2.当没有 ...
- 带搜索框的select下拉框
利用select2制作带有搜索功能的select下拉框 1.引入线上css和js <link href="https://cdnjs.cloudflare.com/ajax/libs/ ...
- Ajax jQuery下拉框联动案例
需求: 使用ajax和jQuery实现下拉框联动. 注意:需要加入jquery-2.1.1.min.js 前台 <!DOCTYPE html> <html> <head& ...
- layui select 下拉框 级联 动态赋值 与获取选中值
//下拉框必须在 class="layui-form" 里 不然监听事件没有作用 <div class="layui-form" > <div ...
- layui给select下拉框赋值
转: layui给select下拉框赋值 layui给select下拉框赋值 //重新渲染表单函数 function renderForm() { layui.use('form', function ...
- s:select下拉框validation验证
S:select下拉框验证: <td colspan="5"> <s:select name="vo.typeVO.corp" list=&q ...
- 自定义样式的select下拉框深入探索
第一个版本: 首先实现自定义select下拉框应该具有的功能,我是选择将原来的select隐藏掉,自己在jquery代码中动态写进去<dl><dd><dt>这样的结 ...
随机推荐
- JVM 内存初学 (堆(heap)、栈(stack)和方法区(method) )（转载）
想想面试的时候很多会问jvm这方面的问题虽然还是菜鸟不太能用到现在但是还是了解一下, 找资料的时候看见个大佬写的很好转载到这方便以后自己复习和给大佬做宣传 以下为大佬的博客原文: 这两天看了一下深入浅 ...
- 【转载】Nginx+Tomcat 动静分离实现负载均衡
0.前期准备 使用Debian环境.安装Nginx(默认安装),一个web项目,安装tomcat(默认安装)等. 1.一份Nginx.conf配置文件 1 # 定义Nginx运行的用户 和 用户组 如 ...
- Win10 新功能 改变显示器色彩
如果你是一个爱看书的工作族,相信一定梦想你的电脑变得跟Kindle一样,这样每天盯着电脑几个小时,眼睛都不会痛了……下面就来看看Win10带来的新体验吧! Ctr+ Windows Key + C 可 ...
- Mybatis架构简介
一.Mybatis与ORM 对象关系映射(即Object Relational Mapping,简称ORM),主要用于关系型数据库和实体之间的映射,主要为了解决对象与关系数据库存在的互不匹配的现象,O ...
- 在Windows上搭建kafka环境
英文文档:https://dzone.com/articles/running-apache-kafka-on-windows-os 第一步:安装JDK 百度很多,不赘述 第二步:安装ZooKeepe ...
- Java 基础知识总结 3
13.java类集 类集实际上是一个动态的对象数组,与一般的对象数组不同,类集中的对象内容可以任意扩充. 类集的特征: 1)这种框架是高性能的 2)框架必须允许不同类型的类集以相同的方式和高度互操作方 ...
- CentOS7+ApacheServer2.4+MariaDB10.0+PHP7.0+禅道项目管理软件8.0环境部署
CentOS7+ApacheServer2.4+MariaDB10.0+PHP7.0+禅道项目管理软件8.0环境部署 by:授客 QQ:1033553122 目录 一. 二. 三. 四. 五. 六. ...
- SQLServer 学习笔记之超详细基础SQL语句 Part 10
Sqlserver 学习笔记 by:授客 QQ:1033553122 -----------------------接Part 9------------------- 删除约束的语法 ALTER T ...
- Oracle EBS GL 会计科目报错 GL_ACCESS_SET_LEDGERS
1.会计科目设置后,总账中找不到对应账簿 2.原因是新版本系统物化视图有问题,参照metalink解决方案得知原路径 ...
- 转：log4net使用详解
说明:本程序演示如何利用log4net记录程序日志信息.log4net是一个功能著名的开源日志记录组件.利用log4net可以方便地将日志信息记录到文件.控制台.Windows事件日志和数据库(包括M ...