layui动态渲染select等组件并初始化赋值失败
描诉:有一个用户信息form表单,其中有部门单选框,数据库中有一张dept(部门)表,要动态渲染出所有部门,并默认选中用户所在部门
关键代码:
- html页面
<div class="layui-form-item">
<label class="layui-form-label">所属部门</label>
<input type="hidden" name="deptHide" class="layui-input deptHide"><!--中间变量-->
<div class="layui-input-inline">
<select name="deptId" lay-filter="sysBunk" id="deptId" class="deptId" lay-search="" disabled></select>
</div>
</div>【必须使用中间变量赋值,因为layui渲染顺序不一样】
- select渲染
$.post("数据接口", function (data) {
$.each(data.data, function (index, item) {
$('#deptId').append(new Option(item.deptName, item.deptId));
});
$('#deptId').val($('.deptHide').val()); //部门单选框选中
//重新渲染select
form.render('select');
}); - form表单渲染
//infoList 即 class="layui-form" 所在元素对应的 lay-filter="" 对应的值
form.val("userInfo", {//表单回显
"xxx": data.data.xxx, //"name": "value",就是表单元素的name
"deptHide": data.data.deptId, //中间变量--因为表单渲染的优先级高于select等组件的优先级
});
form.render();
layui动态渲染select等组件并初始化赋值失败的更多相关文章
- layui动态修改select的选中项
layui动态修改select的选中项:(在layUI下给select设置默认选项) 例: $("select[name='result']").val(11); //重新渲染表单 ...
- layui动态渲染生成select的option值
脚本语言:设定默认值:直接拼接,然后根据返回值渲染select// 动态渲染脚本类型下拉框 // 1.发送ajax请求得到data // 2.将data渲染到页面上 function getDataL ...
- layui navTree 动态渲染菜单组件介绍
navTree.js 简介 extends/navTree.js 是一个基于 layui 扩展的模块化组件,用于构建后台布局系统中的垂直导航菜单与水平导航菜单. extends/navTree.js ...
- Vue3组件(九)Vue + element-Plus + json = 动态渲染的表单控件
一个成熟的表单 表单表单,你已经长大了,你要学会: 动态渲染 支持单列.双列.多列 支持调整布局 支持表单验证 支持调整排列(显示)顺序 依据组件值显示需要的组件 支持 item 扩展组件 可以自动创 ...
- JS动态修改页面EasyUI datebox不生效、EasyUI动态添加Class、EasyUI动态渲染解析解决方案
这是个小菜在实际工作中遇到的问题,相信很多EasyUI新手很可能也遇到这样的问题,因此小菜觉得有必要拿出来分享一下. 这个问题要从EasyUI的datebox组件说起,小菜用这个组件的时候,发现用$( ...
- LayUI分页,LayUI动态分页,LayUI laypage分页,LayUI laypage刷新当前页
LayUI分页,LayUI动态分页,LayUI laypage分页,LayUI laypage刷新当前页 >>>>>>>>>>>> ...
- js动态修改Easyui元素不生效,EasyUI动态渲染解析解决方案
easyui的渲染是在在网页加载完成后,相当于在$(document).ready()事件中,对整个网页进行了一次扫描,发现某个input标签含有easyui的属性,就在相应的地方进行ui的修改.因此 ...
- ListView实现下拉动态渲染数据
欢迎讨论欢迎一起学习:微信jkxx123321 这是一篇关于LIstView实现动态数据渲染的文章![RN] 首先我们讲讲数据是如何来规划的 一般情况下我们有两种规划方案前提比如我们数据是100条+ ...
- 基于 el-form 封装一个依赖 json 动态渲染的表单控件
nf-form 表单控件的功能 基于 el-form 封装了一个表单控件,包括表单的子控件. 既然要封装,那么就要完善一些,把能想到的功能都要实现出来,不想留遗憾. 毕竟UI库提供的功能都很强大了,不 ...
随机推荐
- electron-vue ipcRenderer.on() 调用多次
methods: { isSave (ev) { this.localFileUrl = ev.localFileUrl // 本地的路径 ipcRenderer.send('save-dialog' ...
- Mybatis mysql 一个搜索框多个字段模糊查询 几种方法
第一种 or 根据搜索框给定的关键词,模糊搜索用户名和账号都匹配的用户集合 <select id="list" parameterType="com.user.Us ...
- aspose 模板输出
Dictionary<string, string> dictionnaryBig = new Dictionary<string, string>(); dictionnar ...
- Luogu P2309 loidc,卖卖萌
题目链接:Click here 题目大意:给你一个长度为n的数串,问这个数串的sum为正数的子串个数 Solution: 我们先处理以下前缀和,记为\(s_i\) 则问题可以转化为求有多少对\(i,j ...
- luogu P1063 能量项链 x
P1063 能量项链 题目描述 在Mars星球上,每个Mars人都随身佩带着一串能量项链.在项链上有N颗能量珠.能量珠是一颗有头标记与尾标记的珠子,这些标记对应着某个正整数.并且,对于相邻的两颗珠子, ...
- Thymeleaf 2-基础语法
三.基础语法 1.创建HTML 由上文也可以知道需要在html中添加: <html xmlns:th="http://www.thymeleaf.org"> 这样,下文 ...
- es之主分片和复制分片的交互过程
1:索引(创建或者删除)一个文档 首先:发送一个索引或者删除的请求给node1 其次:node1接收到请求之后,会根据请求中携带的参数“文档id”判断出该文档应该存储在具体哪一个shard中 shar ...
- 第三周总结&实验报告一
第三周总结 在这周对Java进行了更深层次的学习,Java的学习也越来越难了,慢慢的加入了一些新的构造新的方法,还有许许多多简化代码的相关知识,我还是要认真的去吃透这些知识,自己也要慢慢的去研究一些题 ...
- mysql update语句与limit的结合使用
有时候有需要批量更新数据表中从多少行到多少行的某个字段的值 mysql的update语句只支持更新前多少行,不支持从某行到另一行,比如 UPDATE tb_name SET column_name=' ...
- What is 'typeof define === 'function' && define['amd']' used for?
What is 'typeof define === 'function' && define['amd']' used for? This code checks for the p ...