[RESOLVED]Eager validation using the @Html.ValidationSummary()

I am using the validation summary in an MVC 5 project. As part of the blog module I am using tinymce.  In order to get the validation to look and react the same I had to manufacture a lot on the client. So instead I decided to not user the validation message.
So when there is input I want the validation summary to reflect that the field is now valid. I assumed that just calling the $(‘form’).validate() function would handle this but it doesn’t. I am able to  self populate the validation summary with the errors
in the $(‘form’).bind("invalid-form.validate", …..    but it doesn’t re-fire on the validate call. Am I missing something to get this functionality?

//invalid form event
    $("form").bind("invalid-form.validate", function (form, validator) {

        $('#content_placeholder').stop().animate({ scrollTop: '0' }, 400, function () {
            $('#validation_panel').stop().slideDown('slow');
        });

        tinymce.activeEditor.getBody().style.backgroundColor = "#ffe3e3"
        tinymce.activeEditor.getContentAreaContainer().style.border = "1px solid #ff0000";

        if (validator.errorList.length > 0) {

            var valUl = $('.validation-summary-errors ul');

            valUl.html('');
            $.each(validator.errorList, function (index, error) {
                console.log(error);
               valUl.append('<li>' + error.message + '</li>');

            });

        }
        
     
    });
    //end of invalid form event



  $('input[type=text]').on('blur', revalidate);
    $('input[type=text]').on('keyup', revalidate);


    function revalidate() {

        if (submitClicked) {

            var errorMsg = $(this).data('val-required');
            var lis = $('.validation-summary-errors ul').children();
            $.each(lis, function (index, li) {
                if ($(li).html() === errorMsg) {
                    $(this).remove();
                }
            });

            $('form').validate();
        }

    }

Thanks in advance!

The .validate() method is used to setup validation. If you call it a second time, it performs no action but returns the validator object. To force validation, just call .valid() as specified in the docs.

Leave a Reply