validation using codeigniter and jquery-input field validation using codeigniter and jquery | Learning Curve- Perfect Tutorial for the beginers

step1:create an assets folder in the root directory means structure will be like this

/application
/system
/user_guide
/assets/js/custom.js

custom.js

 $(document).ready(function() {
$('#myform').submit(function(){
	
	$.post($('#myform').attr('action'), $('#myform').serialize(), function( data ) {
	if(data.st == 0)
		{
		 $('#my-error').html(data.msg);
		}
				
		if(data.st == 1)
		{
		  $('#my-error').html(data.msg);
		}
				
	}, 'json');
	return false;			
   });

	
});

$(document).ready(function() {

$('#myform').submit(function(){

$.post($('#myform').attr('action'), $('#myform').serialize(), function( data ) {

if(data.st == 0)

{

$('#my-error').html(data.msg);

}

if(data.st == 1)

{

$('#my-error').html(data.msg);

}

}, 'json');

return false;

});

step2:create controller inside application/controllers-validate.php

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Validate extends CI_Controller{

function index()
	{ 
	  
		$data['include'] = 'jquerypage';
		$this->load->view('mypage', $data);	
	
	}
	
	
	function savedata()
	{
				
		$this->load->library('form_validation');
		$this->form_validation->set_rules('name', 'Name', 'required');
		$this->form_validation->set_rules('age', 'Age', 'required');
				
		if ($this->form_validation->run() == FALSE)
		{
						
			echo json_encode(array('st'=>0, 'msg' => validation_errors()));
		}
		else
		{
			
			$name = $this->input->post('name');
			$age = $this->input->post('age');
					
			echo json_encode(array('st'=>0, 'msg' => 'Successfully Submiited'));
		}
		
	}
}
?>

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Validate extends CI_Controller{

function index()

{

$data['include'] = 'jquerypage';

$this->load->view('mypage', $data);

}

function savedata()

{

$this->load->library('form_validation');

$this->form_validation->set_rules('name', 'Name', 'required');

$this->form_validation->set_rules('age', 'Age', 'required');

if ($this->form_validation->run() == FALSE)

{

echo json_encode(array('st'=>0, 'msg' => validation_errors()));

}

else

{

$name = $this->input->post('name');

$age = $this->input->post('age');

echo json_encode(array('st'=>0, 'msg' => 'Successfully Submiited'));

}

step3:create view files inside view folder application/views-mypage.php,jquerypage.php

mypage.php

<?php $this->load->view($include); ?>
jquerypage.php
<html>
<head>

</head>
<body>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="<?=base_url();?>assets/js/custom.js"></script>
<?php 
echo form_open('validate/savedata', array('id'=>'myform')); 

?>

<div id="my-error"></div>

<h5>Name</h5>
<input type="text" name="name" value="<?php echo set_value('name'); ?>" size="50" />

<h5>Age</h5>
<input type="text" name="age" value="<?php echo set_value('age'); ?>" size="50" />
<div><input type="submit" value="Submit" /></div>

</form>
</body>
</html>

<?php $this->load->view($include); ?>

jquerypage.php

<html>

<head>

</head>

<body>

<?php

echo form_open('validate/savedata', array('id'=>'myform'));

</form>

</body>

</html>