I'm working on an option tokenizer for Magento Bundle Product.
I have a input type=number that I want to change with jQuery / Javascript.
<input id="bundle-option-7-qty-input" class="input-text" type="number" value="1">
To change the value I do this:
$("#bundle-option-7-qty-input").attr('value', 99);
The value is changing within the HTML element, but the look of the element does not change the number.
<input id="bundle-option-7-qty-input" class="input-text" type="number" value="99">
Should be this:
It seems like the value attribute is somehow disconnected from the front-end view of the element itself.
I have looked at MDN article on this element and could not find any attribute that would be responsible for the front-end change: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/number
Any ideas how I can change this element's front-end look value?
UPDATE:
I have tried .val() it has the same effect - this is some kind of issue with input type="number"
If you create HTML file with:
And within the Chrome console change the value to 99
The front-end will still show 1:
input type ="number" after HTML element change in Chrome console
UPDATE: it looks like Magento 2 might be changing value property after / before I make the change with jQuery.
Is there a way to detect / block this change?
UPDATE: for now just putting setting timeout and then changing the input seems to work.
I'll see if I can detect the value change.
