select动态加载渲染问题

提问 未结 8 1495
三零网科
三零网科 2018-6-19
悬赏:20飞吻
版本:layui 2.3 浏览器:chrome
我上面写的
<script type="text/html" template lay-url="space/index" >
<select name="spaceid" lay-verify="required" lay-search="">
<option value="">直接选择或搜索选择</option>
{{# layui.each(d.data,function(index,item){ }}
<option value="{{item.spaceid}}">{{item.space_name}}</option>
{{console.log(item.space_name)}}
{{# });}}
</select>
</script>
然后下面
<script>
layui.use(['admin', 'form', 'laydate'], function(){
var $ = layui.$
,admin = layui.admin
,element = layui.element
,layer = layui.layer
,laydate = layui.laydate
,view = layui.view
,util = layui.util
,form = layui.form;
console.log('111');

form.render(null, 'form');
});
</script>

如果按1这种,先是动态加载的出来。然后再打印出来111那select就正常渲染,但如果先打印出来111,那就渲染不成功。请各位大大指导下,怎么每次都渲染成功呀
回帖
  • @三零网科

    <select name="icon" lay-filter="filter" id="iconId" lay-verify="required" lay-search="">


    我是这么写的

    2 回复
  • 动态数据加载完成后,需要对select进行渲染
    http://www.layui.com/doc/modules/form.html#render
    form.render(); //更新全部
    form.render('select'); //刷新select选择框渲染
    0 回复
  • @会飞的牛牛 我在上面写。更新全部都不可以
    0 回复
  • <script type="text/html" template lay-url="space/index" >
    <select name="spaceid" lay-verify="required" lay-search="">
    <option value="">直接选择或搜索选择</option>
    {{# layui.each(d.data,function(index,item){ }}
    <option value="{{item.spaceid}}">{{item.space_name}}</option>
    {{console.log(item.space_name)}}
    {{# });}}

    {{# layui.use(['form'], function(){ }}
    {{# layui.form.render('select');}}
    {{console.log(22222)}}
    {{# });}}
    </select>
    </script>
    如果这样的话。 在最后打印出来22222 只要111不在下面,一样不能渲染。
    @贤心 大佬sos
    0 回复
  • @会飞的牛牛 [委屈] 我其实就想做成我那种的,这样后期升级方便。如果做成ajax的。到时还要改option。
    0 回复
  • 晓暮
    2018-6-21
    没看懂,你渲染模板后在渲染表单就是的啊,没看到你渲染模板的代码
    0 回复
  • @晓暮
    <script type="text/html" template lay-url="space/index" >
    <select name="spaceid" lay-verify="required" lay-search="">
    <option value="">直接选择或搜索选择</option>
    {{# layui.each(d.data,function(index,item){ }}
    <option value="{{item.spaceid}}">{{item.space_name}}</option>
    {{console.log(item.space_name)}}
    {{# });}}

    {{# layui.use(['form'], function(){ }}
    {{# layui.form.render('select');}}
    {{console.log(22222)}}
    {{# });}}
    </select>
    </script>
    如果这样的话。 在最后打印出来22222 只要111不在下面,一样不能渲染。
    0 回复
  • 晓暮
    2018-6-21
    //第三步:渲染模版
    var data = { //数据
    "title":"Layui常用模块"
    ,"list":[{"modname":"弹层","alias":"layer","site":"layer.layui.com"},{"modname":"表单","alias":"form"}]
    }
    var getTpl = demo.innerHTML
    ,view = document.getElementById('view');
    laytpl(getTpl).render(data, function(html){
    view.innerHTML = html;
    });
    你显示的是模板,这一步是模板渲染啊
    laytpl(getTpl).render(data, function(html){
    view.innerHTML = html;
    });
    0 回复