layuiadmin动态模板在联动下拉选框中的使用
layuiadmin动态模板在联动下拉选框中的使用
我现在的需求：选择泵房后动态加载泵房下面的变频柜
第一级下拉选框： 泵房
<script type="text/html" template lay-url="PumpRoom/Options" lay-type="get" lay-done="layui.form.render('select');"><div class="layui-form-item"><label class="layui-form-label">泵房</label><div class="layui-input-inline"><select name="pumpRoomId" lay-verify="required" lay-filter="pumpRoomId"><option value="">请选择</option>{{# layui.each(d.data, function(index, item){ }}<option value="{{item.id}}">{{item.name}}</option>{{# }); }}</select></div></div>
script>
第二级下拉选框：变频柜（根据选择的泵房Id动态加载）
<script id="tpl_frequencyConverterCabinet" type="text/html" template lay-url="FrequencyConverterCabinet/Options" lay-type="get" lay-done="layui.form.render('select');">//手动高亮//手动高亮//手动高亮 要渲染的内容必须包裹一层div且需要属性lay-templateid<div lay-templateid="tpl_frequencyConverterCabinet" class="layui-form-item"><label class="layui-form-label">变频柜</label><div class="layui-input-inline"><select name="frequencyConverterCabinetId" lay-verify="required"><option value="">请选择</option>{{# layui.each(d.data, function(index, item){ }}<option value="{{item.id}}">{{item.name}}</option>{{# }); }}</select></div></div>
script>
//监听泵房选择
form.on('select(pumpRoomId)', function (data) {document.getElementById('tpl_frequencyConverterCabinet').setAttribute('lay-data', '{pumpRoomId:"' + data.value + '"}');layui.view('tpl_frequencyConverterCabinet').refresh();form.render();
});
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！