I’ve build a custom comments form which hooks onto the default comment_form() in twenty twelve child theme. Here is my code functions.php

function pietergoosen_custom_comment_fields($fields) {

                $commenter = wp_get_current_commenter();
                $req = get_option( 'require_name_email' );
                $aria_req = ( $req ? " aria-required='true'" : '' );

                $fields =  array(

  'author' =>
    '<p class="comment-form-author"><label for="author">' . __( 'Name', 'pietergoosen' ) .
    ( $req ? '<span class="required">*</span>' : '' ) . '</label> ' .
    '<input id="author" name="author" type="text" value="' . esc_attr( $commenter['comment_author'] ) .
    '" size="30"' . $aria_req . ' /></p>',

  'email' =>
    '<p class="comment-form-email"><label for="email">' . __( 'email', 'pietergoosen' ) .
    ( $req ? '<span class="required">*</span>' : '' ) . '</label> ' .
    '<input id="email" name="email" type="text" value="' . esc_attr(  $commenter['comment_author_email'] ) .
    '" size="30"' . $aria_req . ' /></p>',

  'verwysing' =>
    '<p class="comment-form-refer"><label for="refer">' . __( 'Where did you hear about us', 'pietergoosen' ) . '</label>' .
    '<input id="verwysing" name="refer" type="text" value="' . esc_attr( $commenter['comment_author_refer'] ) .
    '" size="30" /></p>',
);
        return $fields;
}

add_filter('comment_form_default_fields','pietergoosen_custom_comment_fields');

This is the how I enqueue my jquery scrips in functions.php and also the jquey validation in comment-validation.js. It works fine without going to the default error page wordpress uses.

function pietergoosen_comments_validation() {
if(is_single() && comments_open() ) { 
    wp_enqueue_script('jqueryvalidate', get_stylesheet_directory_uri().'/js/jquery.validate.pack.js', array('jquery'));
    wp_enqueue_script('commentvalidation', get_stylesheet_directory_uri().'/js/comment-validation.js', array('jquery','jqueryvalidate'));
    }
}
add_action('wp_enqueue_scripts', 'pietergoosen_comments_validation');

jQuery(document).ready(function($) {
$('#commentform').validate({

rules: {
  author: {
    required: true,
    minlength: 2
  },

  email: {
    required: true,
    email: true
  },

  comment: {
    required: true,
    minlength: 10
  }
},

messages: {
  author: "Please provide a valid name",
  email: "Please provide a valid email",
  comment: "Comments needs to be at least 20 characters"
},

errorElement: "div",
errorPlacement: function(error, element) {
  element.before(error);
}

});
});

The problem is, I modified the code to include other customizations for the form as in here:

 function pietergoosen_custom_comment_fields($args = array(), $post_id = null) {
        if ( null === $post_id )
                $post_id = get_the_ID();
        else
                $id = $post_id;

        $commenter = wp_get_current_commenter();
        $user = wp_get_current_user();
        $user_identity = $user->exists() ? $user->display_name : '';

        $req      = get_option( 'require_name_email' );
        $aria_req = ( $req ? " aria-required='true'" : '' );
        $html5    = isset( $args['format'] ) && 'html5' === $args['format'];
                $fields =  array(

                'author' =>
                '<p class="comment-form-author"><label for="author">' . __( 'Name', 'pietergoosen' ) .
                ( $req ? '<span class="required">*</span>' : '' ) . '</label> ' .
                '<input id="author" name="author" type="text" value="' . esc_attr( $commenter['comment_author'] ) .
                '" size="30"' . $aria_req . ' /></p>',

                'email' =>
                '<p class="comment-form-email"><label for="email">' . __( 'email', 'pietergoosen' ) .
                ( $req ? '<span class="required">*</span>' : '' ) . '</label> ' .
                '<input id="email" name="email" type="text" value="' . esc_attr(  $commenter['comment_author_email'] ) .
                '" size="30"' . $aria_req . ' /></p>',

                'verwysing' =>
                '<p class="comment-form-refer"><label for="refer">' . __( 'Where did you hear about us', 'pietergoosen' ) . '</label>' .
                '<input id="refer" name="refer" type="text" value="' . esc_attr( $commenter['comment_author_refer'] ) .
                '" size="30" /></p>',
);

        $required_text = sprintf( ' ' . __('Fields marked %s are required and must be filled in'), '<span class="required">*</span>' );

        $arg = array(
                'fields'               => apply_filters( 'comment_form_default_fields', $fields ),
                'comment_field'        => '<p class="comment-form-comment"><label for="comment">' . _x( 'Share your thoughts on this post', 'noun' ) . '</label> <textarea id="comment" name="comment" cols="45" rows="8" aria-required="true"></textarea></p>',
                'must_log_in'          => '<p class="must-log-in">' . sprintf( __( 'Please <a href="%s">sign in</a> to share your thoughts' ), wp_login_url( apply_filters( 'the_permalink', get_permalink( $post_id ) ) ) ) . '</p>',
                'logged_in_as'         => '<p class="logged-in-as">' . sprintf( __( 'You are currently signed in as <a href="%1$s">%2$s</a>. <a href="%3$s" title="Sign out">Sign out?</a>' ), get_edit_user_link(), $user_identity, wp_logout_url( apply_filters( 'the_permalink', get_permalink( $post_id ) ) ) ) . '</p>',
                'comment_notes_before' => '<p class="comment-notes">' . __( 'Be assured, your email will never be shared with anyone' ) . ( $req ? $required_text : '' ) . '</p>',
                'comment_notes_after'  => '<p class="form-allowed-tags">' . sprintf( __( 'Thank you for sharing your thoughts.' )) . '</p>',
                'title_reply'          => __( 'Share your thoughts' ),
                'title_reply_to'       => __( 'Share your thoughts on %s' ),
                'cancel_reply_link'    => __( 'Remove your thoughts' ),
                'label_submit'         => __( 'Send' ),
                );
        return $arg;
}

add_filter('comment_form_defaults', 'pietergoosen_custom_comment_fields');

Everything in my comment form works like it should, but now my validation script is not working. If validation fails, it redirects to the default wordpress error page. My custom validation script is not working to validate the submitted info on page.

Am I using a wrong hook, or is there something I missed in the validation script.