省市區(qū)三級(jí)聯(lián)動(dòng)改良版,拿到的是省市區(qū)的code碼,可以賦值,用法自己有介紹
<script src="./layui/layui.js"></script>
<script>
// 組件路徑
layui.config({
base: './js/'
}).extend({
bioarea: 'bioarea'
});
</script>
<script>
layui.use(['form', 'bioarea'], function() {
var form = layui.form
, bioarea = layui.bioarea
bioarea.render({
elem: '#bioarea-wrap',
defaultData: {
provinceCode: '110000',
cityCode: '110100',
countyCode: '110113'
},
form
})
//監(jiān)聽提交
form.on('submit(demo1)', function(data) {
layer.alert(JSON.stringify(data.field), {
title: '最終的提交信息'
})
return false;
});
//表單取值
layui.$('#LAY-component-form-getval').on('click', function() {
var data = form.val('example');
console.log(data);
alert(JSON.stringify(data));
});
});
</script>
<form class="layui-form bio-form-box" action="" lay-filter="example">
<div class="layui-col-xs12">
<div class="layui-form-item" id="bioarea-wrap">
<label class="layui-form-label add-width required">所屬地域</label>
<label class="layui-form-label small-width">省</label>
<div class="layui-input-inline">
<select style="width: 100px;" class="level-1-select" lay-filter="#bioarea-wrap1level"
name="province">
<option value="">請(qǐng)選擇省</option>
</select>
</div>
<label class="layui-form-label small-width">市</label>
<div class="layui-input-inline">
<select class="level-2-select" lay-filter="#bioarea-wrap2level" name="city">
<option value="">請(qǐng)選擇市</option>
</select>
</div>
<label class="layui-form-label small-width">區(qū)</label>
<div class="layui-input-inline">
<select class="level-3-select" lay-filter="#bioarea-wrap3level" name="county">
<option value="">請(qǐng)選擇市</option>
</select>
</div>
</div>
</div>
</div>
</form>