精华内容
下载资源
问答
  • 今天小编就为大家分享一篇layui-select动态选中值的例子,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • 今天小编就为大家分享一篇layui动态渲染生成select的option值方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • 下面小编就为大家分享一篇layui select动态添加option的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • author:咔咔 wechat:fangkangfk 前端代码 js代码 // 禁止select点击 function disSelect() { var level = $('#is_level1').val();... layer.msg('一级分类父级不可修改');...以上这篇Layui 动态禁止selec
  • layui 动态加载 select

    2021-01-18 18:13:47
    layui ajax select 动态添加数据方法,给我指明了前进的方向。 首先,这是一个学习的过程,并不是最优方案。只是“玩索而有得”而己。 做了一个联动的搜索框,本来一开始想用layuiselect第三方插件,但后来没有成功...

    感谢小张帅三代以及他的好文
    layui ajax select 动态添加数据方法,给我指明了前进的方向。
    首先,这是一个学习的过程,并不是最优方案。只是“玩索而有得”而己。
    做了一个联动的搜索框,本来一开始想用layuiselect第三方插件,但后来没有成功,或者是说没有实现自己想要的目的。就利用layui现成的一套东东做了一下。按钮及功能如下:
    1.年:点击“年”,“商品类别”随刷新并指向第一个“全部数据”,数据表随刷新;
    2.商品类别:点击“商品类别”,“年”不动,数据表随刷新;
    3.搜索文字框:点“搜索文字框”,自动根据“年”和“商品类别”匹配数据库相关内容,也是ajax系列;
    4.搜索:点“搜索”,根据前面3个框的内容做综合查询,并刷新列表;
    5.重置:点“重置”,回到页面初始状态,并且不刷新页面,但刷新列表。

    下面贴出三段代码
    这是html

    <div class="layui-form layui-inline layui-col-md6 "  lay-filter="form_whereyear">
    	<select name="whereyear" id="whereyear" lay-filter="whereyear" >
    	</select>
    </div>
    

    这是JS:

     loadSelect_whereyear:function (doctype,whereyear){
            var form=layui.form;
            var option = "<option value=''>所有年份</option>";//初始化option的选项
            $.ajax({
                url: "/index/docnumberajax/select_whereyear",
                type: 'POST',
                data:'doctype='+doctype
            })
                .done(function(datas) {
                    for(var i=0;i<datas.length;i++){
                        var year=datas[i]['name'];
                        //name是从后台提取的字段;
                        if (year!= whereyear){
                            option+="<option value='"+datas[i]['name']+"'>"+datas[i]['name']+"</option>";//拼接option中的内容
                            $("#whereyear").html(option);//将option的拼接内容加入select中,注意选择器是select的ID
                        }
                        else{
                            option+="<option selected='selected' value='"+datas[i]['name']+"'>"+datas[i]['name']+"</option>";//拼接option中的内容
                            $("#whereyear").html(option);//将option的拼接内容加入select中,注意选择器是select的ID
                        }
    
                    }
                    form.render('select','form_whereyear');//重点:重新渲染select
                })
                .fail(function() {
                    console.log("error");
                });
    
    
        },
    

    这是后台:

        public function select_whereyear(){
            $account = session('adminAccount');
            $usereditor = $account['username'];
            $doctype=input('doctype');
            $where[] = [
                ['a.doctype', '=', $doctype],//这个是文件类型转换1为一种文件,2为另一种文件
                ['a.status','=',1],
            ];
            $docyearData = Db::name('docnumber')->
            alias('a')->
            field(' a.doc_year as name')->
            whereOr('editor|applicant', '=', $usereditor)->
            where($where)->
            order('a.doc_year', 'ASC')->
            group('a.doc_year')->
            select();
    		return json($docyearData);
        }
    
    展开全文
  • 今天小编就为大家分享一篇Layui动态生成select下拉选择框不显示的解决方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • Layui 动态赋值select

    2021-01-25 16:21:14
    layui中通过接口动态渲染select。 话不多说,直接先附上效果图,再附上源码 let count = response.data.services.length; for(let i = 0 ; i < count ; i ++){ $('#inputBox').append(new Option(response...

    layui中通过接口动态渲染select。
    话不多说,直接先附上效果图,再附上源码
    在这里插入图片描述

     let count = response.data.services.length;
     
     for(let i = 0 ; i < count ; i ++){
                $('#inputBox').append(new Option(response.data.services[i].name , response.data.services[i].FormatStorageMedium)); 
         };
      form.render("select");
    
    展开全文
  • 今天小编就为大家分享一篇vue+layui实现select动态加载后台数据的例子,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • 今天小编就为大家分享一篇layui layer select 选择被遮挡的解决方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • layuiselect下拉change事件失效的处理方法 1.select中添加 lay-filter=“test” <select lay-filter=test></select> 2.处方方法 form.on('select(test)', function(data){ console.log(data.elem)...
  • 今天小编就为大家分享一篇Layui 设置select下拉框自动选中某项的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • Layui 动态渲染select

    千次阅读 2018-12-04 09:39:56
    layui-form" name="myform" method="post" action=""&gt; &lt;div class="layui-form-item"&gt; &lt;div class="layui-inline&q

     描述: 选择部门,出来对应部门下面的分组,HTML代码如下:

    <form class="layui-form" name="myform" method="post" action="">
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">部门</label>
                <div class="layui-input-inline">
                    <select class="seloption" lay-filter="departmentid" name="departmentid" id="departmentid">
                        <option value="1">部门1</option>
                        <option value="2">部门2</option>
                        <option value="3">部门3</option>
                    </select>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">分组</label>
                <div class="layui-input-inline layui-form" lay-filter="group">
                    <select class="seloption" name="groupid" id="groupid">
                    </select>
                </div>
            </div>
        </div>
        <div class="layui-form-item" style="margin-left:15rem">
            <div class="layui-inline">
                <button class="layui-btn" lay-submit="" lay-filter="submitAdd">提交</button>
            </div>
        </div>
    </form>

     js代码如下:

    layui.use(['element', 'layer','form'], function () {
        var element = layui.element,
            form = layui.form,
            layer = layui.layer;
        form.on('select(departmentid)', function(data){
            console.log(data.value);
            $.ajax({
                type:'post',
                url:'index',
                data:{departmentid:data.value},
                dataType:'json',
                async:true,
                success:function(datas){ 
                    if(datas == 9){
                        var option = '';
                        for(var i=0;i<datas.length;i++){ 
                            //循环获取返回值,并组装成html代码
                            option +="<option value='"+datas[i].groupid+"'>"+datas[i].groupname+"</option>";
                        }
                    }else{
                       var option = '<option value="0">请选择</option>';  //默认值
                    }
                    $("#groupid").html("");
                    $("#groupid").append(option);
                    form.render('select','group');
                },
            });
        });
    }); 

    好了,这次应该记住了吧,每次遇到这儿每次都要耽误时间琢磨, 真的是好记性不如烂笔头!

     

    展开全文
  • layui 实现select动态赋值和默认选择

    万次阅读 2019-08-13 16:19:25
    layui.form.render('select'); // $("#zh").get(0).selectedIndex = 0; } }); //动态添加下拉框 同时可以设置默认值 $.ajax({ url: '/jygk', // dataType:'json', //type:'post', success: function ...
       $(function () {
            $.ajax({
                type: 'GET',
                url: '/jygk',
                // dataType: 'json',
                success: function (data) {
                    $("#zh").html('<option value="-1">全部账户</option>');
                    $.each(JSON.parse(data).data, function (key, val) {
                        var option1 = $("<option>").val(val.MTId).text(val.MTAccount);
                        //通过LayUI.jQuery添加列表项
                        $("#zh").append(option1);
                        $('#zh').val({
                        {
                            id
                        }
                    })
                        ;
    
                    });
                    layui.form.render('select');
                    // $("#zh").get(0).selectedIndex = 0;
                }
            });
    
            //动态添加下拉框     同时可以设置默认值
            $.ajax({
                url: '/jygk',
                // dataType:'json',
                //type:'post',
                success: function (data) {
                    $('#zh').append(new Option('全部账户', '-1'));
                    $.each(JSON.parse(data).data, function (index, item) {
                        //option  第一个参数是页面显示的值,第二个参数是传递到后台的值
                        $('#zh').append(new Option(item.MTAccount, item.MTId));//往下拉菜单里添加元素
                        //设置value(这个值就可以是在更新的时候后台传递到前台的值)为2的值为默认选中
                        $('#zh').val({
                        {
                            id
                        }
                    })
                        ;
                    });
                    form.render(); //更新全部表单内容
                    //form.render('select'); //刷新表单select选择框渲染
                }
            });
        });

     

    展开全文
  • 今天小编就为大家分享一篇解决使用layuiselect append元素无效或者未及时更新的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • layui 动态赋值select

    万次阅读 2018-08-29 09:23:44
    话不多少,直接贴代码吧 var resultData; var htmls = '请选择</option>'; //全局变量  $.ajax({ ... url: WEB_CONTEXT+'rest/proInforRestFul/getList', ... form.render('select');//需要渲染一下
  • layui-form-item"&gt; &lt;label class="layui-form-label"&gt;执行周期&lt;/label&gt; &lt;div class="layui-input-inline" style="width: 90px;"&...
  • 动态设置layuiselect值 推荐:《javascript基础教程》《layUI教程》 html5中加上下类代码获取初始值。 1 2 之后js中设置select和单选框的值。 1 2 3 4 5 6 7 8 9 10 11 12 举个具体的例子 html中 1 2 3 4 5 6 7 8 ...
  • 监听select选择 form.on('select(filter)', function(data){ console.log(data.elem); //得到select原始DOM对象 console.log(data.value); //得到被选中的值 console.log(data.othis); //得到美化后的DOM对象 })...
  • 使用layui前端框架时,在使用ajax为select动态添加option时,会出现option内容不显示的问题 解决方案: —&amp;gt; 执行 form.render(type,filter) 方法 具体代码: $(function(){ // 异步加载菜品种类...
  • 一定要包裹在form表单中如果不加载form模块,select、checkbox、radio等将无法显示,并且无法使用form相关功能 <form class="layui-form" action="" style="display: flex"> <div class="layui-form-...
  • 对于动态插入select ,form 模块的自动化渲染是失效的,需要执行 form.render(type, filter); 第一个参数:type,为表单的 type 类型 第二个参数:filter,为 class="layui-form" 所在元素的 lay-filter="" 的值。...
  • layui动态添加select选择框和回显

    千次阅读 2020-05-28 10:09:35
    button type="button" class="layui-btn" id="addpeop"> <i class="layui-icon">&#xe608;</i> </button> $("#addpeop").click(function(){ var peop=$("#areas"); var t=$(['<div...
  • layui动态设置select选中

    千次阅读 2020-09-08 16:24:10
    编辑时 动态设置下拉框 layui select 为选中状态 // 当前的select的id $('#type').val('你的value值'); //更新全部 form.render();
  • 下面小编就为大家分享一篇layuiselect的option叠加问题的解决方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • <p>layui动态加载select 加载不出来,后台接口没问题,是能取到数据的,但是赋值却上不去 <p style="text-align:center"><img alt="" src=...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 9,722
精华内容 3,888
关键字:

layui动态的select