前台页面:

<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. STM32F103C8T6-CubeMx串口收发程序详细设计与测试(2)——程序规划、代码编写及测试

    摘要:演示程序的功能:通过中断接收串口数据,在1750us时间内没有收到新的字节的话,将收到的数据原封不动地发送出去,以测试串口的完整收发流程.对使用到的函数进行了说明,阐述了各个函数的调用顺序和调用 ...

  2. 序列化的JavaScript

    下载 序列化的JavaScript序列化的JavaScript 将JavaScript序列化为包含正则表达式.日期和函数的JSON超集. 概述 这个包中的代码最初是作为表示状态的内部模块.为了扩展它的 ...

  3. 9.Android-读写SD卡案例

    1.效果如下所示: 2.读写SD卡时,需要给APP添加读写外部存储设备权限,修改AndroidManifest.xml,添加: <uses-permission android:name=&qu ...

  4. 2014年 实验一  C2C个人拍卖

    实验一  C2C个人拍卖 --实战淘宝 [实验目的] 掌握网上拍卖的基本流程和拍卖平台的运营 [实验条件]⑴.个人计算机一台 ⑵.计算机通过局域网形式接入互联网. ⑶.常用浏览器. [知识准备] 本实 ...

  5. Spring Boot 系列:日志动态配置详解

    世界上最快的捷径,就是脚踏实地,本文已收录架构技术专栏关注这个喜欢分享的地方. 开源项目: 分布式监控(Gitee GVP最有价值开源项目 ):https://gitee.com/sanjianket ...

  6. 扫描仪扫描文件处理-Photoshop批处理内存不足问题解决

    一次批处理上千张扫描图片,如果提示内存不足,这时候需要修改操作系统虚拟内存.最小值:512(512M),最大值建议51200(50G). 同时设置让Photoshop使用100%. 

  7. post 和php://input 转

    $_POST['paramName'] 获取通过表单(multipart/form-data)提交的数据.但有时客户端会直接将请求数据以字符串的形式都放到 body 里传递过来,那么服务端就需要使用  ...

  8. 一篇文章 图解Python 玩转Python

    0 Python 解释器:1.Python数据结构:2.变量与运算符3 Python 流程控制 4 Python 文件处理5 python 输入输出6 Python 异常7 Python 函数和模块8 ...

  9. maven项目导入并运行

    idea导入maven工程流程 找到要导入的文件位置 打开导入 选择manve 一直next就好 选择jdk,选择自己的jdk--home就可以 点击finished 等待坐标导入,查看右侧maven ...

  10. C#一行代码实现(06)跨线程获取控件值,结合BeginInvoke和EndInvoke使用,以DataGridView为例

    主要功能 跨线程获取控件值,以DataGridView为例,结合BeginInvoke和EndInvoke使用 一行代码 object cellValue = dataGridView.ExInvok ...