Wordpress - How to display comment form error messages in the same page

I was facing same problem and was searching for solution i found the solution

Open your function.php file and past below code:

    function comment_validation_init() {
    if(is_single() && comments_open() ) { ?>        
    <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>
    <script type="text/javascript">
    jQuery(document).ready(function($) {
    $('#commentform').validate({

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

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

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

    messages: {
      author: "Please fill the required field",
      email: "Please enter a valid email address.",
      comment: "Please fill the required field"
    },

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

    });
    });
    </script>
    <?php
    }
    }
    add_action('wp_footer', 'comment_validation_init');

For giving style:

.error  { padding: 10px 0 20px 0; color: #FF0000; }
input.error, textarea.error { color:#000000; }

This question have answered again, here

Also you can do the same with JQuery and Validation plugin

You not to do anything other than install comment form JS validation plugin. Click here and download.