Creating server side validation with custom validation attribute does not "trasnfer" the validation rules to the client browser (rendering custom javascript validation function).
You will have to write the validation logic as client script too. There are some things you must do:
Make sure the element (input) that has to be validated on the client looks like that:
<input data-val-MaximumAmount="Validation error massage" />
The data-val-XXX attribute holding the error message is needed.
Html.TextBoxFor
is doing the same (adding such attributes to the html elements rendered).You must create and register client side validation that way:
(function ($) { // Creating the validation method $.validator.addMethod('MaximumAmount', function (value, element, param) { if (...) // some rule. HERE THE VALIDATION LOGIC MUST BE IMPLEMENTED! return false; else return true; }); // Registering the adapter $.validator.unobtrusive.adapters.add('MaximumAmount', function (options) { var element = options.element, message = options.message; options.rules['MaximumAmount'] = $(element).attr('data-val-MaximumAmount'); if (options.message) { options.messages['MaximumAmount'] = options.message; } }); })(jQuery); // Binding elements to validators $(function () { $(':input[data-val-MaximumAmount]').each(function () { $.validator.unobtrusive.parseElement(this, true); }); });