layui 第三方組件平臺

返回首頁 發(fā)布組件

省市區(qū)三級聯(lián)動改良版,拿到的是省市區(qū)的code碼,可以賦值,用法自己有介紹

更新:2020-11-25 創(chuàng)建:2020-12-3

文檔

js 部分
 <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>

html 部分
 <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="">請選擇省</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="">請選擇市</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="">請選擇市</option>
</select>
</div>
</div>
</div>
</div>
</form>

下載

立即下載 去 GitHub 下載
該擴展組件由第三方用戶主動投遞,并由其自身進行維護,本站僅做收集。