解决layui 表单元素radio不显示渲染的问题


Posted in Javascript onSeptember 04, 2019

最近一直在使用layui,一个对程序员相对友好的前端框架,很多效果都进行了初步的封装。

在使用过程中遇到最多的问题就是引用的问题,各种模板无法使用,虽然都一一百度解决。

本次需要解决的问题是 layui-form表单无法渲染效果。

我希望的效果是

解决layui 表单元素radio不显示渲染的问题

但是程序运行效果是

解决layui 表单元素radio不显示渲染的问题

问题分析:

因为这个表单,我是使用laytpl动态插入的,因此表单中radio的效果并没有渲染上,打开调试模式可以看到

正常的radio渲染结果,应该是包括一个i标签和一个span标签

解决layui 表单元素radio不显示渲染的问题

而我们的渲染结果,只有一个input标签

解决layui 表单元素radio不显示渲染的问题

所以导致这个位置没有数据显示。

解决:

由于该框架较新,大部分的内容只能通过官网的论坛获取,所以找了好久,最后在官方文档中看到一句话

有些时候,你的有些表单元素可能是动态插入的。这时Form模块的自动化渲染是会对其失效的。虽然我们没有双向绑定机制(因为我们叫经典模块化框架,咩哈哈哈哈。。。),但没事,你只需要执行 form.render(type); 方法即可。

其中的type即表单的type类型,可选。默认对全部类型的表单进行一次更新。可局部刷新的type如下表:

于是我在模板插入代码的最后,加了一句

form.render(); //更新全部

好了,问题解决!!!!!

以上这篇解决layui 表单元素radio不显示渲染的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
模仿JQuery sortable效果 代码有错但值得看看
Nov 05 Javascript
一个简单的JavaScript数据缓存系统实现代码
Oct 24 Javascript
jQuery 源码分析笔记(6) jQuery.data
Jun 08 Javascript
JS中处理与当前时间间隔的函数代码
May 23 Javascript
JQuery的ready函数与JS的onload的区别详解
Nov 21 Javascript
Python脚本后台运行的几种方式
Mar 09 Javascript
js采用concat和sort将N个数组拼接起来的方法
Jan 21 Javascript
微信小程序列表渲染功能之列表下拉刷新及上拉加载的实现方法分析
Nov 27 Javascript
JS实现的合并多个数组去重算法示例
Apr 11 Javascript
ionic使用angularjs表单验证(模板验证)
Dec 12 Javascript
JavaScript常见事件对象与操作实例总结
Jan 05 Javascript
Node.js API详解之 zlib模块用法分析
May 19 Javascript
对layer弹出框中icon数字参数的说明介绍
Sep 04 #Javascript
Element 默认勾选表格 toggleRowSelection的实现
Sep 04 #Javascript
使用Angular material主题定义自己的组件库的配色体系
Sep 04 #Javascript
vue-loader中引入模板预处理器的实现
Sep 04 #Javascript
解决layer图标icon不加载的问题
Sep 04 #Javascript
JSX在render函数中的应用详解
Sep 04 #Javascript
关于layui的动态图标不显示的解决方法
Sep 04 #Javascript
You might like
用Php实现链结人气统计
2006/10/09 PHP
纯CSS打造的导航菜单(附jquery版)
2010/08/07 Javascript
ExtJs Excel导出并下载IIS服务器端遇到的问题
2011/09/16 Javascript
js读写(删除)Cookie实例详解
2013/04/17 Javascript
js实时获取系统当前时间实例代码
2013/06/28 Javascript
html向js方法传递参数具体实现
2013/08/08 Javascript
jQuery往textarea中光标所在位置插入文本的方法
2015/06/26 Javascript
解决JavaScript数字精度丢失问题的方法
2015/12/03 Javascript
JS实现简单抖动效果
2017/06/01 Javascript
原JS实现banner图的常用功能
2017/06/12 Javascript
关于HTML5的data-*自定义属性的总结
2018/05/05 Javascript
[35:44]2014 DOTA2华西杯精英邀请赛 5 24 iG VS VG
2014/05/26 DOTA
python将html转成PDF的实现代码(包含中文)
2013/03/04 Python
详解在Python程序中自定义异常的方法
2015/10/16 Python
python select.select模块通信全过程解析
2017/09/20 Python
Python实现的维尼吉亚密码算法示例
2018/04/12 Python
Python嵌套式数据结构实例浅析
2019/03/05 Python
浅谈pytorch卷积核大小的设置对全连接神经元的影响
2020/01/10 Python
Python函数的迭代器与生成器的示例代码
2020/06/18 Python
解决PyCharm不在run输出运行结果而不是再Console里输出的问题
2020/09/21 Python
Maje德国官网:法国女性成衣品牌
2017/02/10 全球购物
Office DEPOT法国官网:欧迪办公用品采购
2018/01/03 全球购物
JackJones官方旗舰店:杰克琼斯男装
2018/03/27 全球购物
酒店管理毕业生自荐信
2013/10/24 职场文书
分公司经理岗位职责
2013/11/11 职场文书
采购员岗位职责
2013/11/15 职场文书
中医专业职业生涯规划书范文
2014/01/04 职场文书
毕业自我评价
2014/02/05 职场文书
保密工作实施方案
2014/02/24 职场文书
毕业生求职自荐书范文
2014/03/27 职场文书
明星邀请函
2015/02/02 职场文书
2015年全国爱眼日活动小结
2015/02/27 职场文书
通知的格式范文
2015/04/27 职场文书
银行资信证明
2015/06/17 职场文书
2015年美容师个人工作总结
2015/10/14 职场文书
python基础之文件操作
2021/10/24 Python