layui动态改变radio不生效问题

layui动态改变radio不生效问题

  • 作者:Geticsen
  • 时间:2019-08-06
  • 137人已阅读
简介 有几天没有 更新了主要是是解决bug还有学习东西没时间写,现在水一下博客。

layui动态改变radio不生效问题:

简单描述一下:

下面这段代码是layui的一个简单的radio的使用

<div id="content" class="layui-form-item">
       <div class="layui-inline">
                <label class="layui-form-label">订单类型 <span class="text-red">*</span></label>
                <div id="order_type" class="layui-inline" style="width: 170px;">
                    <input type="radio" name="order_type" value="0" title="先锋" checked='checked'>
                    <input type="radio" name="order_type" value="1" title="大货">
                </div>
        </div>
</div>

假如你想点击按钮来实现radio的选中设置的话那问题在于input的视图不会重新渲染,虽然后端拿到的数据是正确的(选中值)但是前端的显示是不正确的

我想过的解决问题方法:

1直接改:

调用如下函数(失败  显示不变)

function nan(){
    $("input[name='order_type']").get(0).checked=true; 
}
function nv(){
    $("input[name='order_type']").get(1).checked=true; 
}

2把div id="order_type"内的元素清空重新添加 (失败 input添加进去但是不可见)

3把div id="content"内的元素清空重新添加 (其他元素可见  input添加进去但是不可见)

后来一直百度才发现如果改了layui的radio的选中值要重新渲染次可以(真的是巨坑)

具体代码如下:

//dataRows[key]["sfxf"] 是ajax 后端返回的值 
if(dataRows[key]["sfxf"]==0){
        $("input[name='order_type']").get(0).checked=true;
}else{
        $("input[name='order_type']").get(1).checked=true;
}

一定要写 这里是重新渲染form

var form = layui.form;
form.render();


文章评论

Top