layui下拉框select通过Ajax动态加载数据后,动态渲染选中的值

layui下拉框select通过Ajax动态加载数据后,动态渲染选中的值_第1张图片

其中分为两种

1:select中的数据是在页面中写死的,需要从后端取值后判断选中哪一个

 /* 选择select的id 直接赋值 */
 $("#source").val(data.obj.source);
 layui.form.render('select');

2: 动态渲染select后,再选择想要的option

主要是两个方法,掺杂一点小逻辑,亲测有效!

一个方法去后台查询下拉框列表,如果是添加页面,不需要赋值,修改页面则赋值后再渲染

/* 去后台查询出 下拉框 的列表
            *   tid为选中的select的值
            *  */
            function typeList(tid) {
                $.ajax({
                    url:"/commodity_type/list",
                    type:"post",
                    dataType:"json",
                    success:function (data){
                        if (data.code==200){
                            $("#tid").append('');
                            for(var i=0;i'+data.obj[i].name+'');
                                }else{
                                    $("#tid").append('');
                                }
                            }
                        }
                        layui.form.render('select');
                    }
                });
            }

            /* id=0是添加页面,否则是修改页面 */
            var id = $("#cid").val();
            if (id!=0){
                $.ajax({
                    url:"/commodity/commodityById",
                    type:"post",
                    data:{"id":id},
                    dataType:"json",
                    success:function (data){
                        if (data.code==200){
                            $("#cid").val(data.obj.id);
                            $("#cname").val(data.obj.cname);
                            $("#buy_price").val(data.obj.buy_price);
                            $("#sell_price").val(data.obj.sell_price);
                            $("#brand").val(data.obj.brand);
                            $("#address").val(data.obj.address);

                            $("#source").val(data.obj.source);
                            /*
                                在这里调用刚刚的方法去渲染 下拉框
                            */
                            typeList(data.obj.tid);
                        }
                    }
                });
            }else{
                /* 添加页面的话,不用选中,可以不传值 */
                typeList();
            }

水一些字数:===========================================================================================================================================================================================================================

你可能感兴趣的:(前端,java,layui)