拆分String数组以查找和检查复选框

时间:2011-06-15 12:44:27

标签: javascript jquery arrays checkbox

我用逗号分隔字符串。我使用javascript命令split将其分解为数组。

我有一组名为ciContact的复选框。

<table border="0" cellspacing="0" cellpadding="6">
    <tr>
        <td><label>
            <input type="checkbox" name="ciContact[]" value="Call" id="ciContact_0" />
      Call</label></td>
    <td><label>
            <input type="checkbox" name="ciContact[]" value="Email" id="ciContact_1" />
      Email</label></td>

        <td><label>
            <input type="checkbox" name="ciContact[]" value="Text" id="ciContact_2" />
      Text</label></td>
    </tr>
</table>

数组只包含需要检查的值。这些值是从JSON编码的AJAX调用中回显的。但是,这些值(ciContact)都以逗号分隔的数组存储在MySQL数据库中。我有这样做的原因。那么如何读取逗号分隔数组的值并选中相应的复选框?

我试过了:

var ciContact = data.split(", ");
for (var j = 0; j < ciContact.length; j++)
    {
var selected = $('name=ciContact').find('value='+ ciContact[i]);
selected.attr("checked","checked");
}

我离开了那个。哈!

谢谢你们!

4 个答案:

答案 0 :(得分:5)

var ciContact = data.split(", ");
for (var j = 0; j < ciContact.length; j++) {
    $('input[name^=ciContact][value=' + ciContact[j] + ']').attr('checked','checked');`
}

或者,为了稍微好一点的表现:

var ciContact = data.split(", "),
    $inputs = $('input[name^=ciContact]');
for (var j = 0; j < ciContact.length; j++) {
    $inputs.filter('[value=' + ciContact[j] + ']').attr('checked','checked');`
}

或者,幻想:

var ciContact = data.split(", ").join('], [value='),
    $inputs = $('input[name^=ciContact]');

$inputs.filter('[value=' + ciContact + ']').attr('checked','checked');

答案 1 :(得分:2)

有几件事是错的。您的选择器不正确,并且您使用了错误的循环变量(i而不是j)。

这应该这样做:

var ciContact = data.split(", "),
    $elements = $('input[name="ciContact[]"]');

for (var j = 0; j < ciContact.length; j++) {
    $elements.filter('[value="' + ciContact[j] + '"]').attr("checked","checked");
}

答案 2 :(得分:0)

var ciContact = data.split(", ");
var checkboxes = $('input:checkbox[name="ciContact[]"]');

for (var j = 0; j < ciContact.length; j++){
    checkboxes
        .filter('[value="'+ciContact[j]+'"]')
        .attr("checked","checked");
}

你可以see it in action here

答案 3 :(得分:0)

var ciContact = data.split(", ");
var tmpHash = {};
for(var i = 0; i < ciContact.length; i++){
    tmpHash[$.trim(ciContact[i])] = 1; // if you are pretty sure that your data is clean, skip $.trim()
}

$('input[name="ciContact[]"]').each(function(){
    if($(this).val() in tmpHash){
        $(this).attr('checked', 'true');
    }
}

或者有一个名为tog的新javascript库,你可以将它用于你的ajax处理。

function checkBox(data, all_options){
    var ciContact = data.split(", ");
    var tmpHash = {};
    for(var i = 0; i < ciContact.length; i++){
        tmpHash[$.trim(ciContact[i])] = 1; // if you are pretty sure that your data is clean, skip $.trim()
    }

    return Tog().map(all_options, function(opt, key, _num){
        var t = tog.Td().Tog('label').checkbox('$ciContact[]')
            .id('ciContact_', _num);
        if(opt in tmpHash){ t.checked() }

        // close the check box, and append the value as its label
        t.close().cont(opt);
        return t;
    }).html();
}

调用checkBox(数据,选项)将为您提供一段html。 你可以把它附加到$('table tr')之类的东西上 在你的后端,你只需要将所有选项转储到json字符串中。 您的客户端可以轻松地将其视为所谓的“all_options”