Issue with jQuery data() treating string as number

Question

I have a MySQL BIGINT that I am storing in HTML5 data. Then I'm trying to access that value and pass it through an AJAX call.

<div data-id="211285677671858177">

And the JavaScript:

var send_data = {
    id: '' + $(this).data('id')
}
$.post('/send.php', send_data);

The issue is that the jQuery data function seems to retrieve that value as a floating point and not a string. So appending it to a blank string isn't helping because it's already too late - it's already been rounded (in this case to 211285677671858180). What can I do to fix this?

Joshua Pinter · Accepted Answer · 2015-04-07 14:23:50Z

80

This isn't a case of "long int" really, the number you're getting is the closest available representation as a floating-point number.

Anyway, you want the value as a string. Quote the jQuery docs for .data (emphasis mine):

Every attempt is made to convert the string to a JavaScript value (this includes booleans, numbers, objects, arrays, and null) otherwise it is left as a string. To retrieve the value's attribute as a string without any attempt to convert it, use the attr() method.

edited Apr 7, 2015 at 14:23

Joshua Pinter

47.9k23 gold badges261 silver badges258 bronze badges

answered Jun 9, 2012 at 3:17

John Flatness

34.1k5 gold badges81 silver badges81 bronze badges

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

2 Comments

andrewtweber Over a year ago

Okay thanks for the explanation. I wish there were a way to tell data not to convert it but I guess attr will do for now

Johnny Kutnowski Over a year ago

I have also found that using the HTMLElement.dataset is also quite straightforward and fast to implement.

Pointy · Accepted Answer · 2012-06-09 03:14:41Z

3

There's no such thing as a "long integer" in JavaScript. All numbers are 64-bit floating point. Your number there cannot be represented exactly in IEEE-794 floating point representation.

The only way to "fix" this is to make the number into a string in a domain that can cope with big integer values.

answered Jun 9, 2012 at 3:14

Pointy

415k62 gold badges600 silver badges631 bronze badges

2 Comments

andrewtweber Over a year ago

Okay. Regardless, I don't want it to be a number. I want it to be treated is a string, but data seems to treat it as a floating point. Any ideas?

Pointy Over a year ago

All attribute values are strings. However, jQuery tries to be helpful and converts things to numeric type when you use the .data() API. Try just getting the .attr() value of the attribute.

user967451 · Accepted Answer · 2012-06-09 03:09:29Z

2

try typecasting it to string:

id: '' + $(this).data('id').toString();

answered Jun 9, 2012 at 3:09

user967451

4 Comments

user967451 Over a year ago

@andrewtweber total shot in the dark but does using $(this).attr('data-id'); keep it as a string?

andrewtweber Over a year ago

Yes, that does work. Interesting... I wonder if the data thing is a bug then? I'll leave the question open for a while to see what others have to say

user967451 Over a year ago

@andrewtweber it's not a bug, like others have mentioned jQuery is trying to be proactive and assumes what you most likely want. In this case it was wrong to assume.

Alexander Puchkov Over a year ago

This won't work accurately if the value starts with 0, e.g. "001". This expression will return string "1".

moribvndvs · Accepted Answer · 2012-06-09 03:22:38Z

0

Try surrounding the data attribute value in single quotes, if you want data to treat it like a string. Problem there, I guess, is you'll have the quotes to strip.

answered Jun 9, 2012 at 3:22

moribvndvs

42.5k12 gold badges138 silver badges152 bronze badges

Comments

Abhishek Shrivastava · Accepted Answer · 2014-12-17 16:30:20Z

0

I had a similar issue where the data id (alphanumeric) was getting converted through usage of .data() as a result the last few characters were getting converted to all zeroes. It took some research to determine that this is a bug in jQuery implementation of .data().

Reference: http://bugs.jquery.com/ticket/7579

For me, to get the data id directly as a work around, I used .attr("data-id") directly and this gave me the correct id.

edited Dec 17, 2014 at 16:30

answered Dec 17, 2014 at 16:19

Abhishek Shrivastava

7496 silver badges14 bronze badges

Collectives™ on Stack Overflow

Issue with jQuery data() treating string as number

5 Answers 5

2 Comments

2 Comments

4 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

2 Comments

2 Comments

4 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related