表单内嵌的下拉单数据如何从后台获取

提问 未结 8 326
为爱走天涯123
悬赏:20飞吻
版本:layuiAdmin 浏览器:
模版内容如下:
<script type="text/html" template lay-url="./user/userInfo.php" lay-doen="layui.element.render('breadcrumb','sysadminui-user-list');">
<div lay-filter="sysadminui-user-list">
用户名:<input type="text" name="title" value="{{ d.data.userInfo.name }}" required lay-verify="required" placeholder="请输入标题" autocomplete="off"
class="layui-input">
</div>
<script type="text/html" template lay-url="./role/rolelist.php" lay-doen="layui.element.render('breadcrumb','sysadminui-role-list');">
<div>
所属角色<select name="city" lay-verify="" lay-filter="sysadminui-role-list">
{{#
layui.each(d.data,function(index,item) {
}}
<option value="{{ item.id }}">{{ item.name }}</option>
{{#
});
}}
</select>
</div>
</script>
<div lay-filter="sysadminui-user-list">
昵称:<input type="text" name="title" value="{{ d.data.userInfo.nickName }}" required lay-verify="required" placeholder="请输入标题" autocomplete="off"
class="layui-input">
</div>
</script>
=========
文本框中的数据来源于用户表,下拉框中的数据来源于角色表,现在表现出来的效果是下拉框不见了,script里面不能内嵌script
回帖
  • 文档有写动态模板中select的示例,请看这里 https://fly.layui.com/docs/6/#select-tpl ,还有这里的回复 https://fly.layui.com/vipclub/jie/layuiadmin/25930/
    0 回复
  • 我这个是在弹窗里写的表单,获取select值 
    ,success: function (layero) {
    //遮罩
    var loadIndex = layer.load(2);
    //定义form的filter
    layero.addClass('layui-form');
    layero.find('.layui-layer-btn0').attr('lay-filter','channelForm').attr('lay-submit','');
    //发送请求
    $.get(url, { }, function (res) {
    if (res.success) {
    $("#select").empty(); //先清空一下select
    $('#select').append(new Option('',0)); //添加个空option 用于显示 请选择那一栏
    res.data.list.forEach(function (item, index) { //循环添加option
    $('#select').append(new Option(item.name,item.id))
    })

    form.render('select'); //渲染
    form.val('channelForm',{ //赋值选中的那个option
    'select': datas.cid,

    })
    }else{
    againLogin(res);
    }
    layer.close(loadIndex);
    });
    }
    0 回复
  • @Angel丨灬泪雨
    发现一个问题,我的select在script里面,导致$("#rolelist")根本就取不到,无法动态往里面添加内容
    0 回复
  • 获取用
    form.on('select(selectType)', function(data){
    data.value
    })

    添加用我给你说的
    0 回复
  • @为爱走天涯123 layui的select是美化后形成的div标签内容,所以在select做change事件什么的 ,都是监听不到的
    0 回复
  • @Angel丨灬泪雨
    我不需要监听事件,现在的主要问题是无法动态添加option,完整代码如下:
    <script type="text/html" template lay-url="./user/userInfo.php" lay-doen="layui.element.render('breadcrumb','sysadminui-user-list');">
    <div lay-filter="sysadminui-user-list">
    用户名:<input type="text" name="title" value="{{ d.data.userInfo.name }}" required lay-verify="required" placeholder="请输入标题" autocomplete="off"
    class="layui-input">
    </div>
    {{!
    <div>
    所属角色<select name="city" id="rolelist">
    </select>
    </div>
    !}}
    <div lay-filter="sysadminui-user-list">
    昵称:<input type="text" name="title" value="{{ d.data.userInfo.nickName }}" required lay-verify="required" placeholder="请输入标题" autocomplete="off"
    class="layui-input">
    </div>
    </script>
    <script type="text/javascript">
    layui.use(['admin','form'],function () {
    var admin = layui.admin
    ,form = layui.form
    ,$ = layui.$
    ,optionstr = '';

    admin.req({
    url: './role/rolelist.php'
    ,isSetToken: true
    ,done: function (res) {
    console.info(res);
    res.data.forEach(function (item,index) {
    optionstr = '<option value="' + item.id + '">' + item.name + '</option>';
    $("#rolelist").append(optionstr);

    })
    form.render('select');
    }
    });

    return false;
    });
    </script>
    0 回复
  • @为爱走天涯123 select必须在form标签内
    0 回复
  • 把模板中的select标签换成div,数据就显示出来了,不清楚是哪里导致的,可能需要查下源码
    0 回复