0

Currently my value attribute inside a normal numeric input field has not the correct value.

That is the code of my input field:

<input class="form-control input-sm" type="number" min="250" step="250" pattern="\d*" name="amount" value="250" size="5" autocomplete="off" id="amount_SOMEGenericStuff">

So when i'm selecting this field in jQuery:

 $('#amount_SOMEGenericStuff')

It clearly returns the complete field - but the value is not correct. As you can see, the "value attribute value" is on "250". But i've entered "500". So when i do:

 $('#amount_SOMEGenericStuff').val();

It returns 500 - and not 250. That is okay, but i just wonder, how the "value attribute value" is a different from the $('#amount_SOMEGenericStuff').val().

The ID on the input field is unique - so there is no other element on this site, with the name. Also, when i'm updating the value by using $('#amount_SOMEGenericStuff').val(1000), and selecting it as the way before, it also says "1000" as a value. By selecting the whole element, the "value attribute value" still returns "250" - how this is even possible?

Edit:

By using $("#amount_SOMEGenericcStuff").attr('value', 1000); the correct value shows up inside the element attribute value, but won't show up inside the input field value. It's empty.

So, i have more than one amount input field on this site, and all input fields have the same class inputAmount.

By using $('.inputAmount').attr('value', 1000); it updates all input field values (also the attribute values) to an amount of 1000 - but the selected one is still empty inside the field. The attribute value was updated correctly. This is pretty strange..

One more edit (solution):

I really don't know why, but when i'm calling $('.inputAmount').attr('value', 1000); with a little delay, like 50ms, in a setTimeout function, it works like a charm. The thing is, that i'm using a trigger function, that tooks a little bit, until it is done. But i wondering, because when i'm updating the value inside the end of the trigger function, it won't update either. May i should go with a callback to avoid the delays / setTimeout. Thanks to all for the suggestions.

Tyralcori
  • 1,079
  • 13
  • 33
  • 2
    Possible duplicate of [HTML - attributes vs properties](http://stackoverflow.com/questions/19246714/html-attributes-vs-properties) – CBroe Dec 15 '15 at 08:12
  • the value attribute specifies the initial value of an input, but the value property specifies the current value – cpr43 Dec 15 '15 at 08:19
  • 1
    When you set value="250" it is defined as attributes, and property as well. But after you change the value then value property will change. jquery val() return the property value not attribute value. if you wwant to get attribute value use attr("value"). – Nishan Senevirathna Dec 15 '15 at 08:20
  • @NishanSenevirathna thank you! That helped me. But the value does not show up inside the input field. But the attribute value is fixed. Any ideas? – Tyralcori Dec 15 '15 at 08:24
  • Can you make a fiddle so we can see it in action – StudioTime Dec 15 '15 at 08:37
  • @DarrenSweeney in my fiddle, the code is working pretty good! And tbh, i really don't know why. The code is exactly the same, as i use. I've edited my question, and i would appreciate any suggestions. – Tyralcori Dec 15 '15 at 08:47

0 Answers0