Question

我有一个模态形式的2个无线电组。我很难确定如何从json字符串设置每个组的值.json字符串中的最后2个值是“role”和“活性”。激活为1表示是或0表示现在。管理员，员工或用户的角色为1,2或3。我循环通过json字符串并将值分配给字段名称，因为它们在html中都是相同的。

我的HTML是：

<div class="form-field bt-space10">
    <div class="clear">
    <h4 class="fl-space2 ln-22 size-120" style="color:#777777; font-size: 12px; font-weight: normal;">Authorization Role: </h4>

    <div class="form-radio-item clear fl-space2">
        <input type="radio" rel="radiogroup" name="role" id="Admin" value="1" class="radio fl-space" /> <label for="Admin" class="fl">Admin</label>
    </div>

    <div class="form-radio-item clear fl-space2">
        <input type="radio" rel="radiogroup" name="role" id="Staff" value="2" class="radio fl-space" /> <label for="Staff" class="fl">Staff</label>
    </div>  

    <div class="form-radio-item clear fl-space2">
        <input type="radio" rel="radiogroup" name="role" id="User" value="3" class="radio fl-space" /> <label for="User" class="fl">User</label>
    </div>
    </div>
    <div class="clear">
    <h4 class="fl-space2 ln-22 size-120" style="color:#777777; font-size: 12px; font-weight: normal;">Account Activated: </h4>

    <div class="form-radio-item clear fl-space2">
        <input type="radio" rel="radiogroup1" name="activated" id="Yes" class="radio fl-space" /> <label for="radio4" class="fl">Yes</label>
    </div>

    <div class="form-radio-item clear fl-space2">
        <input type="radio" rel="radiogroup1" name="activated" id="No" class="radio fl-space" /> <label for="radio5" class="fl">No</label>
    </div>  
    </div>  

</div><!-- /.form-field-->

我的传入json字符串（如果需要，我可以将返回更改为“Role”：“Admin”等等。并且“激活”：“是”等等）：

{"op": "UPDATE", "id": "7","email": "joe@public.com","name": "Joe Public","address": "123 Any Street","city": "AnyTown","zipcode": "12345","state": "PA","contact_name": "","phone": "8885551212","fax": "","company_branch": "","company_name": "","activated": "1","role": "1" }

我用来填充表单上其他字段的代码：

function editUser(rowID, callback) {
    var ret;
    jQuery.fancybox({
        modal : true,
        padding : 0,
        cache : false,
        overlayOpacity : 0.5,
        href : "userEdit.html",
        onComplete : function() {
            InitProfileMenu()
            var tsTimeStamp= new Date().getTime();
            $.getJSON("includes/GetUserDetails.php?tsTimeStamp&id=" + rowID,     
                function(data) {
                    $.each(data, function(i, item) {
                    $('#' + i).val(item);
                });
            })
            jQuery("#editUser_cancel").click(function() {
                ret = false;
                jQuery.fancybox.close();
            })
            jQuery("#editUser_ok").click(function() {
                jQuery.fancybox.close();
                ret = true;
            })
        },

我已将谷歌搜索到死亡而未找到解决方案。有人有主意吗？或者他们可以指出哪些资源可以帮助解决这个问题？

谢谢！丹尼斯

Answer 1

对于JSON字符串中的所有值，这很难以通用方式解决，因为html属性彼此不同。我建议两个改变：

将值属性添加到名为“已激活”的广播输入

对于JSON数据的每个元素：检查表单输入的类型，如果是radio，则使用name和value属性选择器来检查正确的。

 var myJsonData = {
    "op": "UPDATE",
     "id": "7",
    "email": "joe@public.com",
    "name": "Dennis Megarry",
    "address": "123 Any Street",
    "city": "AnyTown",
    "zipcode": "12345",
    "state": "PA",
    "contact_name": "",
    "phone": "8885551212",
    "fax": "",
    "company_branch": "",
    "company_name": "",
    "activated": "1",
    "role": "1"
};

function updateFormWithJson(dataObj) {
    $.each(dataObj,function(i,item){
        if($('input[name="' + i + '"]:first').attr("type") == "radio"){
            $('input[name="' + i + '"][value="' + item + '"]').attr("checked","checked");
        }
    });
};

$(document).ready(function() {
    updateFormWithJson(myJsonData);
});

<div class="form-field bt-space10">
    <div class="clear">
    <h4 class="fl-space2 ln-22 size-120" style="color:#777777; font-size: 12px; font-weight: normal;">Authorization Role: </h4>

    <div class="form-radio-item clear fl-space2">
        <input type="radio" rel="radiogroup" name="role" id="Admin" value="1" class="radio fl-space" /> <label for="Admin" class="fl">Admin</label>
    </div>

    <div class="form-radio-item clear fl-space2">
        <input type="radio" rel="radiogroup" name="role" id="Staff" value="2" class="radio fl-space" /> <label for="Staff" class="fl">Staff</label>
    </div>  

    <div class="form-radio-item clear fl-space2">
        <input type="radio" rel="radiogroup" name="role" id="User" value="3" class="radio fl-space" /> <label for="User" class="fl">User</label>
    </div>
    </div>
    <div class="clear">
    <h4 class="fl-space2 ln-22 size-120" style="color:#777777; font-size: 12px; font-weight: normal;">Account Activated: </h4>

    <div class="form-radio-item clear fl-space2">
        <input type="radio" rel="radiogroup1" name="activated" id="Yes" value="1" class="radio fl-space" /> <label for="radio4" class="fl">Yes</label>
    </div>

    <div class="form-radio-item clear fl-space2">
        <input type="radio" rel="radiogroup1" name="activated" id="No" value="0" class="radio fl-space" /> <label for="radio5" class="fl">No</label>
    </div>  
</div>

从json设置无线电组

1 个答案: