title: How to implement jquery and CodeIgniter validation library together?
body: <p>I want to create a registration form where I want to use jquery and also the CI validation library. 
  How can I do this? Upon submitting the form, I want the control to go to the validation library using jquery and return the response. Then, if all is well, I want the "form is submitted" message to be displayed on that page itself.</p>
  
  <p>Edit:</p>
  
  <p>here are my codes.</p>
  
  <p>VIEW</p>
  
  <pre><code>&lt;?php $this-&gt;load-&gt;view('template/header'); ?&gt;
  &lt;div id="add_form"&gt;
      &lt;h2&gt;Add New Category&lt;/h2&gt;
  
      &lt;?php echo form_open('abc/abc_category_controller/add_new_category'); ?&gt;
  
      &lt;?php
  
      $category_data = array(
          'name' =&gt; 'category_name',
          'id' =&gt; 'category_name',
          'value' =&gt; set_value('category_name'),
          'maxlength'   =&gt; '15'
      );
  
      $unit_data = array(
          'name' =&gt; 'unit',
          'id' =&gt; 'unit',
          'value' =&gt; set_value('unit'),
          'maxlength'   =&gt; '10'
      );
  
      ?&gt;
  
      &lt;p&gt;&lt;label for="name"&gt;Name: &lt;/label&gt;&lt;?php echo form_input($category_data); ?&gt;&lt;/p&gt;
  
      &lt;p&gt;&lt;label for="unit"&gt;Unit: &lt;/label&gt;&lt;?php echo form_input($unit_data); ?&gt;&lt;/p&gt;
  
      &lt;p&gt;&lt;?php echo form_submit('submit', 'Submit','id="submit"'); ?&gt;&lt;/p&gt;
  
      &lt;?php echo form_close(); ?&gt;
  
      &lt;?php echo validation_errors('&lt;p class="error"&gt;'); ?&gt;
  
  &lt;/div&gt;&lt;!--end add new category-form--&gt;
  
  &lt;div id="success_msg"&gt;
  
  
  &lt;/div&gt;
  
  
  
  &lt;?php $this-&gt;load-&gt;view('template/footer') ?&gt;
  </code></pre>
  
  <p>Controller- add_new_category</p>
  
  <pre><code>&lt;?php
  
      class Stocks_category_controller extends CI_Controller{
  
      function add_new_category()
      {
          //$this-&gt;load-&gt;helper('form');
          $this-&gt;load-&gt;library('form_validation');
  
          $data['title'] = 'Add a new category';
  
          $this-&gt;form_validation-&gt;set_rules('category_name', 'Category Name', 'required');
          $this-&gt;form_validation-&gt;set_rules('unit', 'Unit', 'required');
  
          if ($this-&gt;form_validation-&gt;run() === FALSE)
          {
                $this-&gt;load-&gt;view('abc/add_new_category');
  
  
          }
  
          else
          {
              $category_name = $this-&gt;input-&gt;post('category_name');
  
              $unit = $this-&gt;input-&gt;post('unit');
  
              $this-&gt;load-&gt;model('abc/abc_category_model');
  
              $insert_id=$this-&gt;abc_category_model-&gt;add_new_category($category_name
                                  ,$unit);
  
  
              if($insert_id!=NULL)
              {
                $this-&gt;load-&gt;view('template/success',$data);
              }
  
              else{
                  $data['error_msg']='Error Occurred';
                  $this-&gt;load-&gt;view('template/template',$data);
              }
  
          }
  
      }
  
      function success(){
          $data['success_msg']='New Category Successfully Created';
          $this-&gt;load-&gt;view('template/success',$data);
      }
    }
  </code></pre>
  
  <p>And finally the model.</p>
  
  <p>
  
  <pre><code>   function add_new_category($category_name,$unit){
  
        $data = array(
             'abc_category_name' =&gt; $category_name ,
             'unit' =&gt; $unit
          );
  
          $this-&gt;db-&gt;insert('abc_category', $data); 
          $insert_id=$this-&gt;db-&gt;insert_id();
  
          return $insert_id;
     }
  </code></pre>
  
  <p>}</p>
  
  <p>What I want is that when I submit the form, jquery validation should take place. And if, all is well then the SUccessful message be displayed using ajax only and page should not reload. 
  Also, please tell me is it possible to use jquery validation and CI validation library both and maintaining ajax at the same time?</p>