效果如图,通过ajax接收的数据,动态生成想要的日期
在网上查找一番后,参考别人的代码,记录下来,方便以后查阅
引入的js包
jquery.easyui.min.js
jquery.min.js
(一)在body总添加div标签
<div id="allTime"></div>
(二)js代码
function show(){
var row = $('#tb').datagrid('getSelected');//获取选中行
if (!row) {
$.messager.alert("提示", "请选择您想要查看的仪器!");
return;
}
$('#showTime').form('clear');
$('#instrumentNameShow').textbox('setValue', row.id).textbox("setText", row.name).textbox('textbox').attr('readonly',true);
//用ajax获取数据并自动生成复选框
$.ajax({
type : 'POST',
url : '${pageContext.request.contextPath}/serviceTime/selectAllTime.action',
data : {id:row.id},
success : function(map) {
$("#allTime").empty();
var list = map.rows;
for(var i = 0; i < list.length;i++){
var number = list[i].time;
var day = "";
if(number == 11) day = "星期一上午"
else if(number == 12) day = "星期一下午"
else if(number == 21) day = "星期二上午"
else if(number == 22) day = "星期二下午"
else if(number == 31) day = "星期三上午"
else if(number == 32) day = "星期三下午"
else if(number == 41) day = "星期四上午"
else if(number == 42) day = "星期四下午"
else if(number == 51) day = "星期五上午"
else if(number == 52) day = "星期五下午"
else if(number == 61) day = "星期六上午"
else if(number == 62) day = "星期六下午"
else if(number == 71) day = "星期日上午"
else if(number == 72) day = "星期日下午"
$("#allTime").append(
"<label>"+
"<input id='time' name='time' type='checkbox' value='"+number+"' >"
+ day
+"</label>");
}
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
$.messager.alert("错误提示", "失败!" + textStatus);
}
});
$('#showTime').dialog('open').dialog('center');
}
我是直接copy所写项目中方法,没有截取,主要的代码就是ajax中的内容,从后台获取数据之后,通过循环,写出复选框
for(var i = 0; i < list.length;i++){
var number = list[i].time;
var day = "";
if(number == 11) day = "星期一上午"
else if(number == 12) day = "星期一下午"
else if(number == 21) day = "星期二上午"
$("#allTime").append(
"<label>"+
"<input id='time' name='time' type='checkbox'
value='"+number+"' >"
+ day
+"</label>");
}