[Layui]Open子页面动态下拉框赋值解决办法

Posted 厦门德仔

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了[Layui]Open子页面动态下拉框赋值解决办法相关的知识,希望对你有一定的参考价值。

子页面动态下拉框赋值

上篇文章解决了如何联动问题,但是还有一种情况,open子页面时给动态下拉框赋值。
直接赋值并不可以,此时下拉框是没有数据的。监听函数并不会触发动态函数。

我的思路:
给第一个下拉框直接赋值(本次测试用静态),执行子页面函数加载回调,待回调函数加载完毕数据,然后动态下拉框赋值。

html:

if (obj.event === 'edit') 
                var index = layer.open(
                    title: '编辑视频',
                    type: 2,
                    shade: 0.2,
                    maxmin:true,
                    shadeClose: true,
                    area: ['60%', '60%'],
                    content: '/SysVideo/Edit',
                    success: function (layero, index)
                        //向layer页面传值,传值主要代码
                        var body = layer.getChildFrame('body', index);
                        //获取name名为Id的控件进行赋值
                        body.find("[name='Id']").val(data.id);
                        //body.find("[name='Company'][value='" + data.company + "']").attr("selected", data.company);//radio 赋值
                        body.contents().find("#Company option[value='" + data.company + "']").attr("selected", "selected");//id为Company的静态下拉框选中相应的值

                        body.find("[name='FileName']").val(data.fileName);
                        body.find("[name='Remark']").val(data.remark);
                        body.find("[name='Uploader']").val(data.uploader);
                        //得到iframe页的窗口对象,执行iframe页的方法:iframeWin.method();
                        var iframeWin = window[layero.find('iframe')[0]['name']];
                        //执行表单重新渲染的方法
                        iframeWin.myResend();

                        //赋值动态下拉框调用子页面的方法,页面open完子页面数据还没加载完,传个回调函数
                        iframeWin.flGet(() => 
                            body.contents().find("#Code option[value='" + data.code + "']").attr("selected", "selected");//选中下拉框
                            iframeWin.layui.form.render(); //页面渲染
                        );
                    ,
                    yes: function () 

                    
                );
                return false;
            

JS:

     $.ajax(
                method: "GET",
                url: "http://localhost:8089/api/SysVideo/GetCategorys?company=" + company,
                success: function (result) 
                    if (!result.IsError) 
                        //console.log(result);
                        //$.each(result.Data, function (index, value) 
                        //    $('#Code').append(new Option(value.code, value.name));// 下拉菜单里添加元素

                        //);
                        //layui.form.render();
                        var optionstring = "";
                        $.each(result.data, function (i, item) 
                            optionstring += "<option value=\\"" + item.code + "\\" >" + item.name + "</option>";
                        );
                        $("#Code").html('<option value=""></option>' + optionstring);
                        layui.form.render('select'); //这个很重要

                        if (typeof callback === "function") 
                            callback();
                        
                    
                    else 
                        layer.msg(result.Message);
                    
                ,
                error: function (error) 
                    layer.msg("服务器错误!");
                
            );

测试:

以上是关于[Layui]Open子页面动态下拉框赋值解决办法的主要内容,如果未能解决你的问题,请参考以下文章

easyui 动态添加下拉框

layui的form.val无法动态渲染赋值表单问题解决方法

c# layui 动态表格进行动态赋值

layui修改页面layer.open弹出层给子页面标签赋值

layui下拉多远

解决Layui动态生成select下拉选择框不显示问题