layui select 下拉框 级联 获取选择的值与赋值

摘要： layui用了几年，这个框架十分适合我们后台人员开发。简单易用，用的较多的模块肯定是table模块和form模块了。但是在一个开发团队中，不同的人开发水平的差异，如果没有调用统一的...

layui用了几年，这个框架十分适合我们后台人员开发。简单易用，用的较多的模块肯定是table模块和form模块了。但是在一个开发团队中，不同的人开发水平的差异，如果没有调用统一的公共方法，那就会造成很多样式的不同和公共的bug出现到不同的页面 从而出现耗费过多的精力修改bug。所以我们需要做的是统一样式和方法的调用，将其二次封装以便于开发人员的调用。另一方面也能减少代码的冗余量。介绍一下layui select 下拉框 级联 应怎样获取选择的值与赋值

//下拉框必须在  class="layui-form" 里 不然监听事件没有作用

<div class="layui-form" >
<div class="layui-inline">
<label class="layui-form-label">选择项目：</label>
<div class="layui-input-inline">
<select name="quiz" id="quiz" lay-filter="projectfilter">
</select>
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">选择子级：</label>
<div class="layui-input-inline">
<select name="project" id="project"  >
</select>
</div>
</div>
<button id="shuxinBtn" class="layui-btn" lay-submit="" lay-filter="seekClassRoom">
<i class="layui-icon">&#xe615;</i>
</button>
</div>
 $.ajax({
url : "project/findByParentId",
data : {},
dataType : "json",
success : function(resultData) {
$("#quiz").empty();
if(resultData.code == 0){
console.log(resultData.data);
$("#quiz").append(new Option("请选择项目", ""));
$.each(resultData.data, function(index, item) {
$('#quiz')
.append(new Option(item.projectName, item.id));
});
}else{
$("#quiz").append(new Option("暂无数据", ""));
}
layui.form.render("select");
}
})
//级联子项目
//select 监听
form.on('select(projectfilter)',function(data){
var value=data.value;  //select选中的值
console.log(value);
$.ajax({
url:"project/findParentId",
data:{parentId:value},
dataType:"json",
success:function(resultData){
if(resultData.code == 0){
//清空赋值
$("#project").empty();
console.log(resultData.data);
$("#project").append(new Option("请选择项目", ""));
$.each(resultData.data, function(index, item) {
//赋值
$('#project')
.append(new Option(item.projectName, item.id));
});
}else{
$("#project").append(new Option("暂无数据", ""));
}
layui.form.render("select");
}
})
})
layui.form.render("select");
});

两种赋值方法

$("#getInfoName").find("option[value='"+data.PROJECT_ID+"']").prop("selected",true);
form.render();  //必须要加
        
$("#getInfoName").prop("disabled",true);   //选中不可点击