一、今天使用layui的時候需要根據背景動态建立下拉框,這裡做下簡單記錄
二、首先吐槽一下layui中元件的使用方式:
①layui中分為layui和layer
②layer可以作為一個單獨的元件進行使用
③切記如果你引入了layui那麼一定不要在頁面引入layer的相關資源
④layui中使用元件時要先引入(我感覺是超級XX的)
⑤當你引入了某些元件後如果你的html是動态生成的,比如:
<div v-if="showEdit && (dealType == 'add' || dealType == 'edit')">
那麼恭喜你,元件不會顯示,你需要在引入後進行XX.render();操作
三、不想說了,直接上代碼吧
layui.use(['laypage', 'layer','form','jquery'], function(){
var laypage = layui.laypage,
form = layui.form,
layer = layui.layer,
$=layui.$;
//分頁
laypage.render({
elem: 'xaPage'
,count: xa.postionList.length
,layout: ['count', 'prev', 'page', 'next', 'limit', 'skip']
,jump: function(obj){
xa.pageCount = obj.limit;
xa.getIndex++;
xa.getPageData(obj.curr,obj.limit)
}
});
//下拉框
var url = "../../sys/dept/list";
$.ajax({
type: "get",
url: url,
data: {
},
dataType: 'json',
contentType: "application/json; charset=utf-8",
success: function (data) {
for (var index = 0;index < data.length;index++){
var dataTmp = data[index];
$('#deptPanel').append(new Option(dataTmp.name,dataTmp.deptId));//往下拉菜單裡添加元素
}
form.render();
}
});
});