Element Example:
<textarea class="form-control" id="presentation" required="" minlength="10" maxlength="300"></textarea>
If manually, insert any text, the validation is set to Valid if the length is between 10 and 300 chars.
Example: if i manually write "Hello" on the field and run:
$('#presentation')[0].validity.valid
/*will return "false" as expected*/
but if i use any of this way to change the value of the field:
$('#presentation').prop('value','hell')
//or
$('#presentation').val('hell')
//or
$('#presentation')[0].value='hello'
It will cause:
$('#presentation')[0].validity.valid
/*will return "true" and will cause a validation problem*/
it set the field to valid, and the only way to revalidate is to change the value in the field, manually. this will cause that invalid data could be submitted in the form this field will not be checked.
This is happening in Chrome, firefox, edge and opera.
do you know if there's anyway to force the field to validate his value?
here a fiddler with this problem: https://jsfiddle.net/rfigueiredo/jnuhfsc7/20/