Why Doesn't The Value Attribute Of The Input Change?
Well I have this code in view: and then I doing some event that would call this function: choo
Solution 1:
The valueattribute is not synced with the actual value; that's what the valueproperty is for.
This is not a problem though since you'll never use .getAttribute('value') but use the property .value to access the current value.
Solution 2:
<!DOCTYPE html><html><head><title>Test</title><metacharset="UTF-8" /></head><body><divid="app"></div><divid="buttons"><buttonid="1"data-text="one">1</button><buttonid="2"data-text="two">2</button><buttonid="3"data-text="three">3</button><buttonid="4"data-text="four">4</button><buttonid="5"data-text="five">5</button><inputid="inp"value=""></input></div><script>const onClick = function() {
var dataTextBtnField = this.getAttribute("data-text");
var currentData = document.getElementById("inp").valuevar showValue = currentData + dataTextBtnField
document.getElementById("inp").setAttribute("value", showValue);
document.getElementById("inp").value = showValue;
}
const onChange = function() {
this.setAttribute("value", this.value);
}
document.getElementById('1').onclick = onClick;
document.getElementById('2').onclick = onClick;
document.getElementById('3').onclick = onClick;
document.getElementById('4').onclick = onClick;
document.getElementById('5').onclick = onClick;
document.getElementById('inp').onchange = onChange;
</script></body></html>document.getElementById("inp").setAttribute("value", showValue);
Using this will change in the HTML code only, and won't reflect in the view.
document.getElementById("inp").value = showValue;
Using this will change in the view only, and not in the code.
Use both lines to change at both the locations.
Comment the above-mentioned lines in the attached snippet to observe the same.
Post a Comment for "Why Doesn't The Value Attribute Of The Input Change?"