layui的form.val中的单选按钮动态赋值无效解决

阳光穿透心脏的1/2处 2022-04-24 08:20 978阅读 0赞

在使用layui的form.val对单选框进行动态赋值时发现单选框赋值无效果，经过多次排查，发现动态赋值为1,在form.val写为固定值 ‘1’ 单选框可用，动态时不行，最后只得判断值然后输出固定值，代码在下面

js代码

$.ajax({
                        url     : "接口名称",
                        data    : {
                            //参数名称
                            id  : id1
                        },
                        method  : 'POST',
                        success : function (data) {
                            console.log(data);
                            if (data.code == 0) {
                                var res = data.data;
                                //初始赋值
                                form.val('first', {
                                    'id'              :   res.id,
                                    'name'            :   res.name,
                                    'phone'           :   res.phone,
                                                            //在数据库里面存值为0,1
                                    'sex'             :   res.sex=='1'?'1':'0',
                                    'isphysical'      :   res.isphysical=='1'?'1':'0',
                                    'isupgrade'       :   res.isupgrade=='1'?'1':'0',
                                    'islive'          :   res.islive=='1'?'1':'0',
                                    'companytitle'    :   res.companytitle,
                                    'card'            :   res.card,
                                    'cardtype'        :   res.cardtype,
                                    'address'         :   res.address,
                                    'physicalstatus'  :   res.physicalstatus,
                                    'hobby'           :   res.hobby,
                                    'taboo'           :   res.taboo,
                                    'remark'          :   res.remark,
                                    'firstserver'     :   res.firstserver,
                                    'sencondserver'   :   res.secondserver
                                });
                            } else {
                                layer.msg("code:"+data.code+" msg:"+data.msg);
                            }
                        },
                        error   : function () {
                            layer.msg("可能是因为网络原因操作失败了，请重试，若多次重试不成功，请于网站管理员联系");
                        }
                    });

页面代码

<form class="layui-form layui-form-pane1" action="javascript:;" lay-filter="first">
    
        
        <div class="layui-form-item">
            <label class="layui-form-label">名称</label>
            <div class="layui-input-block">
                <input type="text" name="name" id="name" lay-verify="required|title" required placeholder="请输入客户名称" autocomplete="off" class="layui-input">
            </div>
        </div>
    
        
        <div class="layui-form-item">
             <label class="layui-form-label">性别</label>
             <div class="layui-input-block">
                 <input type="radio" name="sex" value="0" title="男" checked>
                 <input type="radio" name="sex" value="1" title="女">
             </div>
        </div>
    
        
        <div class="layui-form-item">
            <label class="layui-form-label">联系电话</label>
            <div class="layui-input-block">
                <input type="text" name="phone" id="phone" lay-verify="required|title" required placeholder="请输入联系电话" autocomplete="off" class="layui-input">
            </div>
        </div>
    
        
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">退休单位及职称</label>
            <div class="layui-input-block">
                <textarea placeholder="请输入退休单位及职称" id="companytitle" name="companytitle" class="layui-textarea"></textarea>
            </div>
        </div>
    
        
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">卡种</label>
            <div class="layui-input-block">
                <textarea placeholder="请输入卡种" name="card" id="card" class="layui-textarea"></textarea>
            </div>
        </div>
    
        
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">卡种补贴</label>
            <div class="layui-input-block">
                <textarea placeholder="请输入卡种补贴" name="cardtype" id="cardtype" class="layui-textarea"></textarea>
            </div>
        </div>
    
    
        
        <div class="layui-form-item pane">
            <label class="layui-form-label">是否领取居住证</label>
            <div class="layui-input-block">
                <input type="radio" name="islive" value="0" title="是" checked>
                <input type="radio" name="islive" value="1" title="否">
            </div>
        </div>
    
        
        <div class="layui-form-item">
            <label class="layui-form-label">家庭住址</label>
            <div class="layui-input-block">
                <input type="text" name="address" id="address" lay-verify="required|title" required placeholder="请输入家庭住址" autocomplete="off" class="layui-input">
            </div>
        </div>
    
        
        <div class="layui-form-item">
            <label class="layui-form-label">是否体检</label>
            <div class="layui-input-block">
                <input type="radio" name="isphysical" value="0" title="是" checked>
                <input type="radio" name="isphysical" value="1" title="否">
            </div>
        </div>
    
        
        <div class="layui-form-item">
            <label class="layui-form-label">身体状况</label>
            <div class="layui-input-block">
                <input type="text" name="physicalstatus" id="physicalstatus" lay-verify="required|title" required placeholder="请输入身体状况" autocomplete="off" class="layui-input">
            </div>
        </div>
    
        
        <div class="layui-form-item">
            <label class="layui-form-label">兴趣喜好特长</label>
            <div class="layui-input-block">
                <input type="text" name="hobby" id="hobby" lay-verify="required|title" required placeholder="请输入兴趣喜好特长" autocomplete="off" class="layui-input">
            </div>
        </div>
    
        
        <div class="layui-form-item">
            <label class="layui-form-label">禁忌</label>
            <div class="layui-input-block">
                <input type="text" name="taboo" id="taboo" lay-verify="required|title" required placeholder="请输入禁忌" autocomplete="off" class="layui-input">
            </div>
        </div>
    
        
        <div class="layui-form-item">
            <label class="layui-form-label">是否升级转介绍</label>
            <div class="layui-input-block">
                <input type="radio" name="isupgrade" value="0" title="是" checked>
                <input type="radio" name="isupgrade" value="1" title="否">
            </div>
        </div>
    
        
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">备注</label>
            <div class="layui-input-block">
                <textarea placeholder="请输入备注" name="remark" id="remark" class="layui-textarea"></textarea>
            </div>
        </div>
    
        
        <div class="layui-form-item">
            <label class="layui-form-label">第一服务顾问</label>
            <div class="layui-input-block">
                <input type="text" name="firstserver" id="firstserver" lay-verify="required|title" required placeholder="请输入第一服务顾问" autocomplete="off" class="layui-input">
            </div>
        </div>
    
        
        <div class="layui-form-item">
            <label class="layui-form-label">第二服务顾问</label>
            <div class="layui-input-block">
                <input type="text" name="sencondserver" id="sencondserver" lay-verify="required|title" required placeholder="请输入第二服务顾问" autocomplete="off" class="layui-input">
            </div>
        </div>
    
        <br/>
        <hr>
        <br/>
    
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="*">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>

上面是我的解决方式，获取表格中性别选择代码

layui.use('form', function(){
    //监听提交
                form.on('submit(*)', function(data){
                    console.log(data);
                    data = data.field;
                    $.ajax({
                        url     : "接口名称",
                        data    : {
                            id              : data.id,
                            name            : data.name,
                            sex             : data.sex,
                            phone           : data.phone,
                            title           : data.title,
                            cardtype        : data.cardtype,
                            card            : data.card,
                            subsidy         : data.subsidy,
                            islive          : data.islive,
                            address         : data.address,
                            familystatus    : data.familystatus,
                            isphysical      : data.isphysical,
                            physicalstatus  : data.physicalstatus,
                            hobby           : data.hobby,
                            taboo           : data.taboo,
                            isupgrade       : data.isupgrade,
                            remark          : data.remark,
                            firstserver     : data.firstserver,
                            secondserver    : data.secondserver,
                            status          : data.status,
                            companytitle    : data.companytitle
                        },
                        method  : 'POST',
                        success : function (data) {
                            if (data.code == 0) {
                                layer.msg("操作成功");
                            } else {
                                layer.msg("code:"+data.code+" msg:"+data.msg);
                            }
                        },
                        error   : function () {
                            layer.msg("可能是因为网络原因操作失败了，请重试，若多次重试不成功，请与网站管理员联系");
                        }
                    });
                    return false;
                });
    
            });