Skip to main content

Bug Tracker

Side navigation

#10239 closed feature (invalid)

Opened September 09, 2011 05:21PM UTC

Closed September 09, 2011 09:08PM UTC

div (and other non-input elements?) .val no work. suckage.

Reported by: Owned by:
Priority: low Milestone: None
Component: attributes Version: 1.6.3
Keywords: Cc:
Blocked by: Blocking:

Possibly intentional on your part, but in 1.6.3 div does not return .attr("value") when calling .val()

$('#div_id').val();  // returns ""
$('#div_id').attr("value");  // returns contents of value attr

this is annoying, but vastly better than 1.6.1 in which

$('#div_id').attr("value"); // also returns ""

PLEASE consider returning .attr("value") for .val() on divs and other non-input elements.

Attachments (0)
Change History (3)

Changed September 09, 2011 06:34PM UTC by timmywil comment:1

component: unfiledattributes
owner: →
priority: undecidedlow
status: newpending

Thanks for taking the time to contribute to the jQuery project! Please provide a complete reduced test case on jsFiddle to help us assess your ticket.

Additionally, be sure to test against the jQuery Edge version to ensure the issue still exists. To get you started, use this boilerplate: Open the link and click to "Fork" (in the top menu) to get started.

I am unable to reproduce this issue.

Finally, due to issues with backwards compatibility, we did add support for retrieving the value property with the .attr() method and that is the way it should work in 1.6.3. Nevertheless, this will be deprecated in the future and should no longer be used. You can do .prop('value') instead or, as you said, use the method dedicated to retrieving values, aptly named ".val()".

Changed September 09, 2011 08:40PM UTC by dmethvin comment:2

@timmywil, I think he was saying .val() does not "work" on a div element, but it's hard to tell without a complete specific test case. This shows results on a div:

.val() is intended to get the values of form elements, as the API docs say. You can use it on other types of elements and get results of some sort, but they are not guaranteed to be consistent across jQuery versions.

.attr("value") should be used to get the value attribute of an element. It was broken in older versions of jQuery, and for that we apologize, but I think it's consistent now.

.prop("value") should be used to get the value property of an element. It is a relatively new API but if you need to support older versions of jQuery it's easy to shim it yourself.

No HTML or XHTML doctype defines a value property or attribute for a div element. If you are defining one, the document will not pass the W3C validator. It is not a good idea to use arbitrary names for app-specific attributes on elements, since those names may be appropriated by a standard in the future -- or may even be in use today. You know that HTML4 defines a value attribute for LI elements, for example, right?

If you are attaching app-specific data to an element, look into the HTML5 data- attributes.

Changed September 09, 2011 09:08PM UTC by timmywil comment:3

resolution: → invalid
status: pendingclosed


As you said, value is not a valid attribute or property on a div element. However, we have code in place to retrieve a value attribute on a div anyway (that is, if the property does not exist, which it doesn't).


Again, due to backwards compat issues, .attr('value') does retrieve the value property, but only if present on the element. Since the value attribute/property is invalid on a div element, .attr() will retrieve the given attribute value instead because there isn't a value property (normally there would be a property if the attribute was valid).

In conclusion, don't do that. But if you do, jQuery works anyway.

As dmethvin mentions, define custom attributes using HTML5's data-* attributes( e.g. data-value).