HTML5 / jQuery: Working with custom attributes

Question

Hi I was wondering if someone could give me a hand with how exactly data-* works... I need to create a custom attribute which will be accessed with jquery...

heres what i got so far:

HTML

<select name='province' class='province' data-IsSelectSingle='true'> ... etc ...

jQuery

if($.data("IsSelectSingle") != "true")

and even though its true it executes still... ive also tried...

if($.data($(".province"), "IsSelectSingle") != "true")

Figured I'd try that since thats what it shows as the method on the jquery site but it doesn't seem to work either... any ideas why this might be?

Thanks in advance!

Paul Bruno · Accepted Answer · 2012-03-13 23:49:21Z

5

You need to grab the element via its selector (.province), and then use .attr or .data to get the data:

$(".province").attr("data-IsSelectSingle") != "true"

or

$(".province").data("IsSelectSingle") != "true"

Note, there are major differences between .attr and .data, and they way they handle HTML5 data attributes. See the docs for reference (.attr & .data).

answered Mar 13, 2012 at 23:49

Paul Bruno

1,9041 gold badge17 silver badges26 bronze badges

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

3 Comments

Orlando Over a year ago

hmm it seems to have worked using $(".province").attr("data-IsSelectSingle") != "true" but not with .data I'm gonna read up on .data a bit more none the less but your first solution definately worked thanks a bunch!!

Paul Bruno Over a year ago

Absolutely. :) Happy to help. And see that documentation... that use of .data should work for the data attribute. If it's not, there might be something else at play.

Paul Bruno Over a year ago

Actually, in more recent experience, I discovered what I believe has always been true about the .data method: it kind of "evals" the value of the attribute. So, for the above to work, @Lord-Link, you'd have to != true (or better yet, !== true), instead of quoting "true".

Tim Withers · Accepted Answer · 2012-03-13 23:50:03Z

1

You need a selector for the data for it to know where to look for the data attribute.

if($("select.province").data("IsSelectSingle")!="true")

answered Mar 13, 2012 at 23:50

Tim Withers

12.1k5 gold badges45 silver badges68 bronze badges

Collectives™ on Stack Overflow

HTML5 / jQuery: Working with custom attributes

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related