如何使用jQuery创建一个csv的所有复选框相关联的文本？ [英] How can I use jQuery to create a csv of all checked checkboxes associated text?

问题描述

我得到了大部分的方式，我需要一个答案我的问题在这里：

I got most of the way to what I need with an answer to my question here: How can I get the value of labels associated with checkboxes (and did I break jsfiddle)?

...但我有另一个相关问题，即如何使用jQuery创建一个csv的所有复选框相关文本？

...but I have another related question, namely, "How can I use jQuery to create a csv of all checked checkboxes associated text?"

到目前为止，缺少的部分被评论，在这里： JS fiddler链接

What I've got so far, with the missing piece commented, is here: JS fiddler link

HTML是：

<button id="btnDept">select Depts</button>
<div id="dialog" title="Select the Depts you want to include in the report" style="display:none;">
    <div>
        <section class="breakAfter">
            <label for="ckbxSelectAll">Select All</label>
            <input type="checkbox" id="ckbxSelectAll" />
            <label for="ckbxDeselectAll">Deselect All</label>
            <input type="checkbox" id="ckbxDeselectAll" />
        </section>
        <label for="ckbx2">2</label>
        <input type="checkbox" id="ckbx2" />
        <label for="ckbx3" id="lbl3">3</label>
        <input type="checkbox" id="ckbx3" />
    </div>
</div>

CSS是：

.breakAfter {
    display:block;
}

jQuery是：

var deptsSelected = '';
$("#btnDept").click(function () {
    $("#dialog").dialog({
        modal: true
    });
    $("input:checkbox").click(function () {
        var checkedVal = $("label[for='" + this.id + "']").text();

        if (checkedVal == "Select All") {
            $(":checkbox").prop("checked", true);
            $("#ckbxDeselectAll").prop("checked", false);
            // How can I add all of the vals to deptsSelected (except "Select All" and "Deselect All")? 
        } else if (checkedVal == "Deselect All") {
            $(":checkbox").prop("checked", false);
            $("#ckbxDeselectAll").prop("checked", true);
            deptsSelected = '';
        } else {
            if (deptsSelected.indexOf(checkedVal) < 0) {
                deptsSelected += $("label[for='" + this.id + "']").text() + ',';
            }
        }
        alert(deptsSelected);
    });
});

IOW，我需要循环遍历所有标签元素，

IOW, I need to loop through, I would think, all label elements, appending their text value and a comma (and then lop the final comma off the end).

我更新了 jsfiddle 以包含我需要的所有复选框：

I updated the jsfiddle to include all the checkboxes I will need:

我在C＃实用程序中创建了其余的复选框：

I created the rest of the checkboxes in a C# utility:

private void button1_Click(object sender, EventArgs e)
{
    string s = string.Empty;
    for (int i = 4; i < 100; i++)
    {
        s += string.Format("<label for=\"ckbx{0}\">{0}</label><input type=\"checkbox\" id=\"ckbx{0}\" />", i);           
    }
    textBox1.AppendText(s);
}

推荐答案

c $ c> join 函数从映射的复选框生成 csv 全选复选框。

You can use the join function to generate the csv from the map of checked checkboxes excluding the 'Select All' checkbox.

以下是您可以执行的操作：

Following is what you can do:

deptsSelected = $.map($(':checkbox:not(#' + this.id + '):checked'), function(elem, index) {
    return $("label[for='" + elem.id + "']").text();
}).join(',');

这里是显示这个的小提琴： http://jsfiddle.net/BaKYh/

And here is the fiddle that shows this: http://jsfiddle.net/BaKYh/

这里有两个新功能的文档： ve used：

Here are the documentation for the two new functions I've used:

map（）： http://api.jquery.com/jQuery.map/

join（）： https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/join

这篇关于如何使用jQuery创建一个csv的所有复选框相关联的文本？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！