layui - 表单元素radio单选框取值和赋值

表单radio样式结构

<form class="layui-form">
    <div class="layui-form-item">
        <label class="layui-form-label">是否完成</label>
        <div class="layui-input-block">
            <input type="radio" name="is_ok" value="0" title="否"/>
            <input type="radio" name="is_ok" value="1" title="是" checked="checked"/>
        </div>
        <div class="layui-form-mid layui-word-aux">备注信息</div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="btnSubmit">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>

JavaScript

<script type="text/javascript">
    layui.use(['form', 'jquery'], function () {
        var form = layui.form;
        var $ = layui.$;

        // 点击按钮提交触发
        form.on('submit(btnSubmit)', function (data) {
            // 获取单选按钮的值
            data.field.is_support = $("input[name='is_ok']:checked ").val();// 获取单选框的值,并赋值给data对象里
            var formData = data.field;//获取表单中所有的name属性字段

            // ....发送ajax
        })
        
//-----------------------------------------------------
        // .....发送ajax请求 successMsg接口返回的json数组
        $("input[name='title']").val(successMsg.data.title);// 给普通文本框赋值
        if (successMsg.data.is_ok == '0') {
            $("input[name='is_ok']").eq(0).prop('checked', true);// 给单选赋值
        } else {
            $("input[name='is_ok']").eq(1).prop('checked', true);
        }
        form.render();// 赋完值一定要重新渲染下form表单
//-----------------------------------------------------
    })
</script>
Last modification:May 18th, 2019 at 04:36 pm
如果觉得我的文章对你有用,请随意赞赏

Leave a Comment