I am trying to make a basic form using standard html inputs that only allow numbers. The input has an onkeyup event handler that filters the value and sets an internal variable if it is numeric characters.
The problem is the input is not respecting the value I am setting and displays all keys entered.
Input:
<label>
<span class="required">Site ID: {siteId}</span>
<input type="text" class="text-input" onkeyup={handleSiteIdChange} value={siteId}/>
</label>
handler:
@track siteId = '';
handleSiteIdChange(event) {
const value = event.target.value;
if (!isNaN(value)) {
this.siteId = event.target.value;
}
}
Before I get suggestions to use lightning-input I am using standard inputs because I am unable to override the styling on lightning-input.
