jQuery - find control using custom attribute

Question

I am using CheckBoxList control of Asp.Net. In order to get selected checkboxes i am adding a custom attribute for Value after binding the data to the checkboxlist.

I am able to get the checked checkboxes in jQuery but i dont know how to find a particular checkbox using that custom attribute in the checkboxlist.

here is the code:

After databind in .cs file:

    foreach (ListItem li in cblRequestTypes.Items)
        li.Attributes.Add("itemValue", li.Value);

To get the selected checboxes:

$(":checkbox").each(function() {
              if (this.checked) {

                selectedChecks += $(this).parent().attr("itemValue") + "~";

              }
            });

Now i am passing the values in the querystring and based on that i have to find the checkbox which has the itemValue attribute sent in the querystring. This part is not working or may be i am missing something here.

var id = $.QueryString["id"]
$(id.split("~")).each(function (i, item) {
                $("checkbox[itemValue=" + item +"]").attr('check',checked');

            });

This is how the HTML for CheckBoxList is rendered:

<span itemValue="3"><input id="chkBoxList_0" type="checkbox" name="chkBoxList$0" /><label for="chkBoxList_0">Text 1</label></span>
<span itemValue="5"><input id="chkBoxList_1" type="checkbox" name="chkBoxList$1" /><label for="chkBoxList_1">Text 2</label></span>
<span itemValue="6"><input id="chkBoxList_2" type="checkbox" name="chkBoxList$2" /><label for="chkBoxList_2">Text 3</label></span>
<span itemValue="7"><input id="chkBoxList_3" type="checkbox" name="chkBoxList$3" /><label for="chkBoxList_3">Text 4</label></span>
<span itemValue="8"><input id="chkBoxList_4" type="checkbox" name="chkBoxList$4" /><label for="chkBoxList_4">Text 5</label></span>
<span itemValue="9"><input id="chkBoxList_5" type="checkbox" name="chkBoxList$5" /><label for="chkBoxList_5">Text 6</label></span>

I'll answer this on the condition you never do weird stuff with ~ ever again. I've already cleaned up one ASP project that had that in it. — Incognito
– Incognito, Commented Feb 21, 2012 at 23:30
Why not use the value attribute that any input element already has? Or put the itemValue on the checkbox itself? Or, if you're using HTML5, use a data-item-value attribute - then your markup is still valid — Flambino
– Flambino, Commented Feb 21, 2012 at 23:38
@Incognito : whats wrong with ~? Its just a separator. I can use comma as well but the text i have may contain comma so i chose ~. — Asdfg
– Asdfg, Commented Feb 22, 2012 at 0:30
What if I use a ~? What happens when I add/remove checkboxes? — Incognito
– Incognito, Commented Feb 22, 2012 at 0:47
@Incognito : i get your point. I better pass array in the showmodaldialog instead of querystring value. — Asdfg
– Asdfg, Commented Feb 22, 2012 at 4:20

Flambino · Accepted Answer · 2012-02-21 23:49:46Z

2

$("span[itemValue=8] input")

That'll get you the checkbox in the span where itemValue (in this example) is 8.

As I said in my comment, it's a little confusing that you're placing your value attribute on the span elements, and it seems to be confusing you too, since your selector is $("checkbox[itemValue=" + item +"]") - which doesn't make much sense.

Your selector will look for a checkbox element - which doesn't exist; the element you're looking for is input (with the type "checkbox").
And it'll try to find one that has the dataValue attribute - which none of the checkboxes do, since that attribute is on the span.

edited Feb 21, 2012 at 23:49

answered Feb 21, 2012 at 23:35

Flambino

18.9k2 gold badges44 silver badges59 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Asdfg Over a year ago

Thanks for pointing out my mistake. The reason it generates span element is because it is a checkboxlist control. I am not sure what other control i can use here.

Flambino Over a year ago

@Asdfg Did it otherwise answer your question? Just asking, since it's still open. Don't know how to set the value on the checkboxes themselves, though; I'm not an asp.net guy

Giscard Biamby · Accepted Answer · 2012-02-21 23:39:44Z

1

Someone else already answered this, but when i tried to upvote the answer it appeared to have been deleted.

Try:

$('span[itemValue=8] input')

(where 8 is the id you want to look for; happened to pick 8 for this example)

answered Feb 21, 2012 at 23:39

Giscard Biamby

4,6191 gold badge24 silver badges24 bronze badges

1 Comment

Flambino Over a year ago

Yeah, sorry about the deleted answer. I posted my answer, re-read the question, got confused, deleted the answer... and now I've re-posted my answer with modifications :-P

Collectives™ on Stack Overflow

jQuery - find control using custom attribute

2 Answers 2

2 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related