描述: 选择部门,出来对应部门下面的分组,HTML代码如下:
<form class="layui-form" name="myform" method="post" action="">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">部门</label>
<div class="layui-input-inline">
<select class="seloption" lay-filter="departmentid" name="departmentid" id="departmentid">
<option value="1">部门1</option>
<option value="2">部门2</option>
<option value="3">部门3</option>
</select>
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">分组</label>
<div class="layui-input-inline layui-form" lay-filter="group">
<select class="seloption" name="groupid" id="groupid">
</select>
</div>
</div>
</div>
<div class="layui-form-item" style="margin-left:15rem">
<div class="layui-inline">
<button class="layui-btn" lay-submit="" lay-filter="submitAdd">提交</button>
</div>
</div>
</form>
js代码如下:
layui.use(['element', 'layer','form'], function () {
var element = layui.element,
form = layui.form,
layer = layui.layer;
form.on('select(departmentid)', function(data){
console.log(data.value);
$.ajax({
type:'post',
url:'index',
data:{departmentid:data.value},
dataType:'json',
async:true,
success:function(datas){
if(datas == 9){
var option = '';
for(var i=0;i<datas.length;i++){
//循环获取返回值,并组装成html代码
option +="<option value='"+datas[i].groupid+"'>"+datas[i].groupname+"</option>";
}
}else{
var option = '<option value="0">请选择</option>'; //默认值
}
$("#groupid").html("");
$("#groupid").append(option);
form.render('select','group');
},
});
});
});
好了,这次应该记住了吧,每次遇到这儿每次都要耽误时间琢磨, 真的是好记性不如烂笔头!