title: Form validation and AJAX form submit using jQuery and CodeIgniter
body: <p>I am using following code for inserting comments:</p>
  
  <pre><code>&lt;div id="2" class="789678"&gt;
      &lt;div id="dynamic2"&gt;
          &lt;span class="error" style="display:none"&gt;Please Enter Valid Data&lt;/span&gt;
          &lt;span class="success" style="display:none"&gt;Submitted Successfully&lt;/span&gt;
          &lt;form action="http://localhost/ci/index.php/#"
          method="post" accept-charset="utf-8" name="commentform" id="commentform"&gt;
              &lt;div style="display:none"&gt;
                  &lt;input type="hidden" name="token" value="552e5dab8e50b8263c8b7ba548adaf5b"&gt;
              &lt;/div&gt;
              &lt;p&gt;
                  &lt;label for="Name"&gt;Name&lt;/label&gt;
                  &lt;br&gt;
                  &lt;input type="text" name="name" value="" id="name" size="30" placeholder="Please Enter Name or Nick name"
                  class="required"&gt;
              &lt;/p&gt;
              &lt;p&gt;
                  &lt;label for="email"&gt;Email Address&lt;/label&gt;
                  &lt;br&gt;
                  &lt;input type="text" name="email" value="" id="email" size="30" placeholder="Enter Email Address"
                  class="required"&gt;
              &lt;/p&gt;
              &lt;p&gt;
                  &lt;label for="comment"&gt;comment&lt;/label&gt;
                  &lt;br&gt;
                  &lt;textarea name="content" cols="40" rows="5" id="content" col="180" placeholder="Post Your Comment"
                  class="required"&gt;&lt;/textarea&gt;
              &lt;/p&gt;
              &lt;input type="hidden" id="post_id" name="post_id" value="2"&gt;
              &lt;input type="hidden" id="num" name="num" value="789678"&gt;
              &lt;button name="button" type="reset" id="button" value="true"&gt;Add Comment&lt;/button&gt;
          &lt;/form&gt;
      &lt;/div&gt;
      &lt;input type="button" id="adcom" value="Add Comment" style="display: none; "&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>following is my jQuery code for submitting page without page refresh. It's working correctly but I need to add validation which is not working and it's not showing any errors either:</p>
  
  <pre><code>&lt;script&gt;
      $("#button").live("click", function (e) {
          e.preventDefault();
          $("#commentform").validate();
          var currentId = $(this).parent().parent().parent().attr('id');
          var num = $('#num').val();
          var email = $('#email').val();
          var post_id = $('#post_id').val();
          var name = $('#name').val();
          var content = $('#content').val();
          var token = $('input[name="token"]').val();
          var dataString = 'num=' + num + '&amp;email=' + email + '&amp;content_id=' + post_id + '&amp;name=' + name + '&amp;content=' + content + '&amp;token=' + token;
          $.ajax({
              type: "POST",
              url: "http://localhost/ci/index.php/mobiles/mobile_insert_comment/",
              data: dataString,
              success: function (result) {
                  $("#commentform").remove();
                  //$("#dynamic"+currentId).text(' successfully submitted');
                  $('.success').fadeIn(200).show();
                  $('.error').fadeOut(200).hide();
              }
          });
          return false;
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>I am using following jQuery validation plugin:</p>
  
  <pre><code> &lt;script type="text/javascript"
   src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"&gt;&lt;/script&gt;
  </code></pre>