Question

22

html input displays different text to value that it posts

rated 0 times [ 27] [ 5] / answers: 1 / hits: 29850 / 10 Years ago, thu, july 31, 2014, 12:00:00

I am feeling really stupid and not sure if doing something really dumb what... so excuse me in advance.

I have the following HTML:

<input type=text value=0 name=pcscubes id=pcscubes>

I have the below jquery syntax:

var cubes=123.2;

$(#pcscubes1).val(cubes);

var test=$(#pcscubes1).val();

alert(test);

When the jquery executes, the input box will display 123.2 and the alert will be 123.2.

if you inspect the html object though, the value is still 0?

so the display of the input is different from what the real value is. so when I submit this form it posts 0 rather than 123.2

Now I have built a whole web app with this syntax and works perfectly. today it just stops working? I have restarted browser, checked old code that was working, logged off and on and still it does the same.

web app obviously has jquery loaded and jquery ui on this form.

using codeigniter?

any ideas as I am banging my head over something so stupid....

Out of interest I created the below fiddle and it is doing the same?
http://jsfiddle.net/49nqU/

enter

why is the value 0 when it is showing 123.2?

Thanks as always,

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

theodore

Add To Favorites

Follow

Total Points: 318

Total Questions: 97

Total Answers: 119

Location: Turks and Caicos Islands

Member since Sun, Mar 7, 2021

3 Years ago

answered 10 Years ago jamilab · Accepted Answer

This is a case of attributes vs. properties.

What you are seeing in the inspector is the value attribute, which does not update when you programmatically update a field's value property.

Pay no attention to what the DOM inspector says; it'll only show the value as it was when the page loaded (unless you explicitly change the field's value attribute rather than, as jQuery's val() does, its value property.)

Further reading: http://jquery-howto.blogspot.co.uk/2011/06/html-difference-between-attribute-and.html

Some attributes are closely tied to their property counterparts. That is to say, updating the property also updates the attribute. This is the case, for example, with the class attribute and its className property counterpart. value, however, is different; updating the property does not update the attribute (but, just to confuse things further, updating the attribute does update the property!)