ngTagsInput
ngTagsInput copied to clipboard
mbenford
no way to display error message for maxlength or invalid pattern
If there's a max length set and the text is too long, or it's an invalid pattern, then the error message is going to be leftoverText:true.
There's no flag that's set to find out why that text is there. It's just red. Even a way to get the leftoverText and then validate it again myself just so I can show a message "too long" or "invalid pattern"
Same case with minLength.
The "quick workaround" would be to listen for the onInvalidTag($tag) method in your code, and evaluate what is causing it to be invalid; and show/hide your own appropriate message(s).
I've had a look in the code at why we're not seeing these validation messages:
It's simply that there are no $setValidity() calls with minLength, maxLength, invalidPattern keys, inside the setElementValidity() function.
The "fix" would to be to add these $setValidity() checks inside the aforementioned method, along with the validationOptions keys array; and relevant other calls to clear the validation errors, such as when the element's focused.
Heck, the validation is done elsewhere inside canAddTag(), so should be a piece of cake to implement/copy!
👍 I've tested it out locally by updating the ng-tags-input.js with the above and confirm it works a treat for me!
I'll try and contribute by updating the code with these checks in, when I can; if someone doesn't already beat me to it! 😆
