jQuery cannot get custom attributes on UL elements

Question

I am currently focussing the following issue with jQuery 1.8.2.

Custom attributes are working fine for e.g. input fields:

<input id="test" required="true">

$("#test").prop("required")

true

$("#test").get(0).required

true

But not with UL elements.

<ul id="test" required="true"></ul>

$("#test").prop("required")

undefined

$("#test").get(0).required

undefined

Any ideas why it does not work with UL elements in Firefox 16 but in MSIE 8? Thanks!

I have specific "Checklist" inputs and the UL is the "group". — Peter, Oct 18 '12 at 09:06

score 4 · Accepted Answer · answered Oct 18 '12 at 09:14

4

If you need to use custom attributes for one reason or another, check out HTML5 data- attributes.

<ul id="test" data-required="true"></ul>

console.log($('#test').data('required'));

http://ejohn.org/blog/html-5-data-attributes/

http://api.jquery.com/data/#data-html5

answered Oct 18 '12 at 09:14

billyonecan

20,090
8
42
64

That answer helped me out most. It works on both MSIE 8 and Firefox 16. Thanks! – Peter Oct 18 '12 at 09:22

Ram · Answer 2 · 2012-10-18T09:16:13.117

1

That's because HTML5 required is a valid property for input elements and jQuery returns the value of this property, and for an ul element required is just an invalid attribute. An ul element has no required property, so it's undefined.

http://www.whatwg.org/specs/web-apps/current-work/multipage/common-input-element-attributes.html#the-required-attribute

edited Oct 18 '12 at 09:16

answered Oct 18 '12 at 09:10

Ram

143,282
16
168
197

This answer is almost correct. However, made-up attributes, such as asdf, got the same issue – Peter Oct 18 '12 at 09:21
There is a vast difference between an attribute and DOM property. – Ram Oct 18 '12 at 09:25

score -1 · Answer 3 · answered Oct 18 '12 at 09:07

-1

You must use:

$('#test').attr('required')

answered Oct 18 '12 at 09:07

voodmania

73
8

when you alert this it return `required` – Pragnesh Chauhan Oct 18 '12 at 09:09
No, this just returns required independent of the value (true/false) – Peter Oct 18 '12 at 09:10
You are right, I didn't test it. This is how I do it when I use custom attributes in my code. Sorry, for the incorrect answer. – voodmania Oct 18 '12 at 09:12
I¡ve checked, and this is correct. When a html element has the "required" attribute, is value is meaningless. – voodmania Oct 18 '12 at 09:17

jQuery cannot get custom attributes on UL elements

3 Answers3