This is a quick post to show how you can add a custom error message when using Vuelidate in Vue3. In my case I have a price field that should not be greater than $1000. The issue is that I store the amount in cents which results in the following error:
This is obviously a little ambiguous to the user who isn’t aware that everything is running in cents behind the scenes. In order to avoid the issue I used a helper in @vuelidate/validates:
// Import the following in your component
helpers, // Helpers provides access to the message customisation
} from "@vuelidate/validators";
// Add the following validation rule
maxValue: helpers.withMessage("Price cannot be more than $1000.00" , maxValue(100000)),
With the new rule in place the error is much more useful:
I’ve started on a new MVC5 project and came across the following error message while trying to register a new user:
Passwords must have at least one non letter or digit character.
Passwords must have at least one digit (‘0’-‘9’).
Passwords must have at least one uppercase (‘A’-‘Z’)
While having a secure password is obviously important, I felt that most users would probably find these requirements a little extreme. After a bit of Googling I came across a StackOverflow post that mentioned a config class that you can use to edit these settings:
Ran into the following error while I was mucking around with CakePHP today:
preg_match() [function.preg-match]: Delimiter must not be alphanumeric or backslash
The error seemed a little weird as I wasn’t using any regex. It turned out that it was because of my custom validation methods. I had marked them as private instead of public. A bit of an ambiguous error message so hopefully this will be able to help some of you out!
The fields that were flagging as not present were :acknowledged and completed. After hardcoding the values and still not getting anywhere I realised that while values were being provided, they were boolean values of false. Apparently :presence will treat a value of false as not being present.
After another Google search I came across this post which shows how to validate a boolean value.
When implemented within my app, the new validation looks like this: