jquery multi-select 简单用法的备份
来源:互联网 发布:机器人 毛笔字 算法 编辑:程序博客网 时间:2024/06/06 20:54
控制器SpringMVC
html页面部分
<!DOCTYPE html>
<html>
<head>
<link href="lou-multi-select-e052211/css/multi-select.css" media="screen" rel="stylesheet" type="text/css">
</head>
<body>
<!-- 下拉列表 -->
<select multiple="multiple" id="my-select" name="mySelect[]"></select>
<!-- 做事件响应的按钮 -->
<button id="but" >按钮</button>
</body>
</html>
</html>
js部分
<!-- 引入jquery文件 -->
<script src="js/jquery-1.8.3.min.js" type="text/javascript"></script>
<!-- 引入jquery.multi-select.js -->
<script src="lou-multi-select-e052211/js/jquery.multi-select.js" type="text/javascript"></script>
<script type="text/javascript">
//页面 加载初始化
$(document).ready(function(){
var url="auto/all_statement.action";
ajaxPost(url,callback);
})
function ajaxPost(url,ok,data,a){//url:路径,ok:ajax成功后的回调函数,data:ajax的参数,a:是否准许深度序列化。
if(data==null||data.length==0){
data=1;
}
$.ajax({
url:url,
data:data,
traditional: a,
type:"post",
async:true,
datatype:"json",
success:ok
});
}
//为下拉列表添加option成功后的回调函数。
function callback(result){
$.each(result,function(i,u){
$("#my-select").append("<option value="+u.id+">"+u.statement+"</option>")//ajax为下拉列表动态加载option
});
$('#my-select').multiSelect();
}
$(function(){
$("button").click(function(){
var $this=$(this).attr("id");
//点击按钮将下拉列表的数据传到后台
if($this=="but"){
var selecteds=$("[name='mySelect[]']").val();
var url="auto/select_statement.action";
ajaxPost(url,suc,{"selecteds":selecteds},true);
}
})
})
//向后台传数据成功后的回调函数。
function suc(){
alert("成功")
}
</script>
后台部分,本例只是做了简单的输出。
/**
*
* 接收页面传递过来的String[]类型的数据
*
* @param selecteds
* String[]
* @return
*/
@RequestMapping("/select_statement.action")
@ResponseBody
public boolean selectStatement(String[] selecteds) {
for (int i = 0; i < selecteds.length; i++) {
System.out.println(selecteds[i]);// 简单的做个输出
}
return false;
}
- jquery multi-select 简单用法的备份
- jquery中select的用法
- JQuery Multi Select With Two ListBox
- Jquery操作表单Select元素的用法
- Jquery操作表单Select元素的用法
- Jquery操作表单Select元素的用法
- jquery的checkbox,radio,select常用用法
- MySQL的select的简单用法
- Jquery select用法
- jquery select用法
- JQuery select option用法
- mysql select简单用法
- mysql select简单用法
- Developing a Multi-Select ASP.NET GridView using JQuery
- jquery操作select用法集合
- JQuery中的select用法总结
- jquery下的select dropdownlist用法总结(待续)
- jQuery模拟的简单的select下拉菜单
- HDUOJ 1466 计算直线的交点数
- spring技术内幕 读书笔记(二)
- 题目1034:寻找大富翁
- html各种宽高
- linux chmod修改文件夹\文件权限
- jquery multi-select 简单用法的备份
- 使用js制作滑动条
- Android启动后,加载的2类service (Native 系统Service, Java 系统Service)
- Java String关于indexof方法区分大小写的一个小贴士
- 子序列的和
- 动态规划--3.最长公共子序列LCS和最长公共子字符串
- 设计模式:模板方法
- 【Android 进阶】Android 按键事件简单理解
- 题目1010:A + B