前台页面:

<select name="xm" id="xm" lay-verify="required" lay-filter="xmFilter">
<option value=""></option>
</select>

前台js:

<script>

layui.use(['form', 'upload', 'layer'], function () {

var form = layui.form;

    

//检查项目添加到下拉框中
$.ajax({
url: '../hwjg_App/hwjgApp_ashx/GetXm.ashx',
dataType: 'json',
type: 'get',
success: function (data) {
$.each(data, function (index, item) {
$('#xm').append(new Option(item.xm, item.id));// 下拉菜单里添加元素
});
layui.form.render("select");

//重新渲染 固定写法
}
})

});

})

</script>

再补充两点:

1.假如你的下拉框在绑定了数据之后出现数据,但是样式丢失的话

第一个方面你要看是否忘记了form.render();

假如你已经重新渲染了还是没有样式  你可以在外层加一个<form class="layui-form"></form>

2.弹层中的下拉框通常会只出现一半  另一半被遮住从而使弹层页面出现一个纵向滚动条 解决办法,添加css:

.layui-layer-page .layui-layer-content {
overflow: visible !important;
}

layui下拉框后台动态赋值的更多相关文章

  1. layui select 下拉框 级联 动态赋值 与获取选中值

    //下拉框必须在 class="layui-form" 里 不然监听事件没有作用 <div class="layui-form" > <div ...

  2. layui下拉框数据过万渲染渲染问题解决方案

    方案一:layui下拉框分页插件 https://fly.layui.com/jie/29002/ 此插件我用了下浏览器缓存有问题,而且当下拉框数据量过万后,会一直渲染不出来,期待后期作者优化 如图下 ...

  3. layui下拉框渲染问题,以及回显问题

    最近实习公司给的新人练手项目用的layui,layui之前自己也接触过但是也就是用了用table组件,没有用过layer弹层这些东西,所以就了解了一下. 首先遇到的一个问题就是下拉框没有样式,然后加样 ...

  4. EF5+MVC4系列(7) 后台SelectListItem传值给前台显示Select下拉框;后台Action接收浏览器传值的4种方式; 后台Action向前台View视图传递数据的四种方式(ViewDate,TempDate,ViewBag,Model (实际是ViewDate.Model传值))

    一:后台使用SelectListItem 传值给前台显示Select下拉框 我们先来看数据库的订单表,里面有3条订单,他们的用户id对应了 UserInfo用户表的数据,现在我们要做的是添加一个Ord ...

  5. easyui combotree下拉框多选赋值

    发现jquery.easyui.min.js 1.3.4版本的用setValues给多选下拉框赋值不成功,只能用1.3.1版本的 Html代码: <input id="ProductL ...

  6. Layui下拉框改变时触发事件

    layui.use(['form', 'layer'], function () { var form = layui.form(); var layer = layui.layer; form.on ...

  7. kendo 级联加带搜索的下拉框以及js赋值

    1‘.js给下拉框赋值 $("#UserRole").data("kendoDropDownList").value(dataItem.RoleName); $ ...

  8. layUI 下拉框遮挡

    原项目中把layui内置的富文本编辑器替换成了百度的ueditor,但是出现了一点问题,下拉框被遮挡了! 在网上查询了一些方法,发现最简单的方法就是在当前页面的<head>标签中加入 &l ...

  9. layui下拉框不显示的问题

    1.先检查有没有引入layui.js 2.然后看有没有被<form class="layui-form"></form>包住, 3.查看是否有以下代码 &l ...

随机推荐

  1. ubuntu20 使用命令安装 rabbitmq

    安装 rabbitmq sudo apt-get install erlang-nox -y sudo apt-get update sudo apt-get install rabbitmq-ser ...

  2. Axure实现vcg官网首页原型图

    W240第二天第三天 Axure的简单使用: 作业实现:vcg官网首页原型图 帮助文档基础篇:原型图基础之axure线框图设计 导航栏设计: 添加通用母版header 导航栏设计注意: 鼠标移动到下面 ...

  3. 每日一题 LeetCode 491. 递增子序列 【递推】【递增子序列】【动态规划】

    题目链接 https://leetcode-cn.com/problems/increasing-subsequences/ 题目说明 题解 主要方法:递推:动态规划 解释说明: 数据表示:观察数据范 ...

  4. 移动吉比特H2-2光猫超级用户与密码

    移动吉比特H2-2光猫超级用户与密码 超级用户名CMCCAdmin 密码aDm8H%MdA----------------版权声明:本文为CSDN博主「BenSon.Album」的原创文章,遵循CC ...

  5. scp远程上传

      scp -P 22 /Users/mac/Downloads/VBoxGuestAdditions_5.2.12.iso root@192.168.1.210:/usr/local/src   s ...

  6. spring boot:swagger3文档展示分页和分栏的列表数据(swagger 3.0.0 / spring boot 2.3.3)

    一,什么情况下需要展示分页和分栏的数据的文档? 分页时,页面上展示的是同一类型的列表的数据,如图: 分栏时,每行都是一个列表,而且展示的数据类型也可能不同 这也是两种常用的数据返回形式 说明:刘宏缔的 ...

  7. DataX 3.0 源码解析一

    源码解析 基本调用类分析 任务启动由python脚本新建进程进行任务执行,后续执行由Java进行,以下将对java部分进行分 其中的调用原理机制. Engine 首先入口类为com.alibaba.d ...

  8. laytable 前台删除后加载当前页数据。

    laytable一次性获取数据后,点击删除调用后台删除.返回成功状态后刷新当前页数据. 渲染方法: //渲染表格 function renderingTable(pageIndex, sourceDa ...

  9. hdu3555 Bomb (数位dp入门题)

    Bomb Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 131072/65536 K (Java/Others)Total Submi ...

  10. 如何配置网络,使内网和WiFi同时使用

    实习已经一个多月了,来分享一个网络小知识,  进入正题了,初次进公司都会遇到一个问题,就是公司内网和WiFi不能同时使用,其实打开powershell配置一下路由即可 1. 打开powershell( ...