Create, Read, Update and Delete Records in Codeigniter using Ajax – CRUD OPERATION

Create, Read, Update and Delete Records in Codeigniter using Ajax

Create, Read, Update and Delete Records in Codeigniter using Ajax - CRUD OPERATION

In this tutorial, I will show you how to make the CRUD operations ie. create, read, update and delete records in codeigniter using Ajax.

If you are a beginner to ‘codeigniter with ajax’ then you must definitely read this tutorial. It is a simple CRUD in codeigniter using ajax.
This is Advance level of codeigniter tutorials series.

 

Step 1.

Set up the basic configuration in Codeigniter framework and create the following files:

  1. home controller(home.php) under the directory(application/controller/).
  2. home model (home_model.php) under the directory(application/model/).
  3. home view(home.php) under the directory(application/views/).
  4. edit view(edit.php) under the directory(application/views/).

 

Step 2.

Now create a curd table name with curd.

[code]

— Table structure for table `curd`

CREATE TABLE IF NOT EXISTS `curd` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`name` varchar(255) NOT NULL,
`email` varchar(255) NOT NULL,
`contact` varchar(255) NOT NULL,
`facebook_link` varchar(255) NOT NULL,
`created` date NOT NULL,
PRIMARY KEY (`id`)
)
[/code]

 

Step 3.

Paste the following code in home.php controller which we created in step 1.

[code]
<?php if ( ! defined(‘BASEPATH’)) exit(‘No direct script access allowed’); class Home extends CI_Controller { public function __construct() { parent::__construct(); $this->load->model(‘home_model’);
$this->load->library(‘form_validation’);
}

public function index()
{
$this->load->view(‘home’);
}

public function fillgrid(){
$this->home_model->fillgrid();
}

public function create(){
$this->form_validation->set_rules(‘name’, ‘Name’, ‘required’);
$this->form_validation->set_rules(’email’, ‘Email’, ‘required|valid_email’);
$this->form_validation->set_rules(‘contact’, ‘Contact Number’, ‘required|numeric|max_length[10]|min_length[10]’);
if ($this->form_validation->run() == FALSE){
echo’

<div class="alert alert-danger">’.validation_errors().'</div>

‘;
exit;
}
else{
$this->home_model->create();
}
}

public function edit(){
$id = $this->uri->segment(3);
$this->db->where(‘id’,$id);
$data[‘query’] = $this->db->get(‘curd’);
$data[‘id’] = $id;
$this->load->view(‘edit’, $data);
}

public function update(){
$res[‘error’]="";
$res[‘success’]="";
$this->form_validation->set_rules(‘name’, ‘Name’, ‘required’);
$this->form_validation->set_rules(’email’, ‘Email’, ‘required|valid_email’);
$this->form_validation->set_rules(‘contact’, ‘Contact Number’, ‘required|numeric|max_length[10]|min_length[10]’);
if ($this->form_validation->run() == FALSE){
$res[‘error’]=’

<div class="alert alert-danger">’.validation_errors().'</div>

‘;
}
else{
$data = array(‘name’=> $this->input->post(‘name’),
’email’=>$this->input->post(’email’),
‘contact’=>$this->input->post(‘contact’),
‘facebook_link’=>$this->input->post(‘facebook’));
$this->db->where(‘id’, $this->input->post(‘hidden’));
$this->db->update(‘curd’, $data);
$data[‘success’] = ‘

<div class="alert alert-success">One record inserted Successfully</div>

‘;
}
header(‘Content-Type: application/json’);
echo json_encode($res);
exit;
}

public function delete(){
$id = $this->input->POST(‘id’);
$this->db->where(‘id’, $id);
$this->db->delete(‘curd’);
echo’

<div class="alert alert-success">One record deleted Successfully</div>

‘;
exit;
}

}

/* End of file home.php */
/* Location: ./application/controllers/home.php */
[/code]

 

Step 4.

Paste the following code in home_model.php which we created in step 1.

[code]
<?php if ( ! defined(‘BASEPATH’)) exit(‘No direct script access allowed’); class Home_model extends CI_Model { public function fillgrid(){ $this->db->order_by("id", "desc");
$data = $this->db->get(‘curd’);
foreach ($data->result() as $row){
$edit = base_url().’home/edit/’;
$delete = base_url().’home/delete/’;
echo "
<tr>
<td>$row->name</td>
<td>$row->email</td>
<td>$row->contact</td>
<td>$row->facebook_link</td>
<td>$row->created</td>
<td><a href=’$edit’ data-id=’$row->id’ class=’btnedit’ title=’edit’><i class=’glyphicon glyphicon-pencil’ title=’edit’></i></a>&nbsp;&nbsp;&nbsp;&nbsp;<a href=’$delete’ data-id=’$row->id’ class=’btndelete’ title=’delete’><i class=’glyphicon glyphicon-remove’></i></a></td></tr>";
}
exit;
}

public function create(){
$data = array(‘name’=> $this->input->post(‘name’),
’email’=>$this->input->post(’email’),
‘contact’=>$this->input->post(‘contact’),
‘facebook_link’=>$this->input->post(‘facebook’),
‘created’=>date(‘d/m/y’));
$this->db->insert(‘curd’, $data);
echo’
<div class="alert alert-success">One record inserted Successfully</div>
‘;
exit;
}

}

?>
[/code]

 

Step 5

Paste the following code in home.php view file.

[code]
<!DOCTYPE html>
<!– To change this license header, choose License Headers in Project Properties. To change this template file, choose Tools | Templates and open the template in the editor. –>
<html>
<head>
<meta charset="UTF-8">
<title>Meul Tech Codeigniter tutorial</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link href="http://cdnjs.cloudflare.com/ajax/libs/jquery.colorbox/1.4.33/example1/colorbox.min.css" rel="stylesheet"/>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-wp-preserve="%3Cscript%20src%3D%22https%3A%2F%2Fcode.jquery.com%2Fjquery-2.1.1.min.js%22%2F%3E%0A%20%20%20%20%20%20%20%20%3Cscript%20src%3D%22https%3A%2F%2Fmaxcdn.bootstrapcdn.com%2Fbootstrap%2F3.2.0%2Fjs%2Fbootstrap.min.js%22%3E%3C%2Fscript%3E" data-mce-resize="false" data-mce-placeholder="1" class="mce-object" width="20" height="20" alt="&lt;script&gt;" title="&lt;script&gt;" />
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-wp-preserve="%3Cscript%20src%3D%22http%3A%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fjquery.colorbox%2F1.4.33%2Fjquery.colorbox-min.js%22%3E%3C%2Fscript%3E" data-mce-resize="false" data-mce-placeholder="1" class="mce-object" width="20" height="20" alt="&lt;script&gt;" title="&lt;script&gt;" />

<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-wp-preserve="%3Cstyle%3E%23loader%7Bdisplay%3A%20none%7D%3C%2Fstyle%3E" data-mce-resize="false" data-mce-placeholder="1" class="mce-object" width="20" height="20" alt="&lt;style&gt;" title="&lt;style&gt;" />
</head>
<body>
<div class="container">
<img id="loader" src="<?php echo base_url()?>asset/712.GIF" style="position: absolute; left: 45%; background: #ff9900; padding: 5px; width: 50px; box-shadow: 0px 0px 3px #333"/>
<div class="row clear_fix">
<div class="col-md-12" style="position: relative">
<blockquote>
<h3>Create, Read, Update and Delete Records in codeigniter using Ajax<small>By Meul Tech </small></h3>
<small><a href="http://webrocom.net/delete-multiple-recoed-based-checkbox-using-ajax-php-codeigniter/">Back to Article</a></small>
</blockquote>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-wp-preserve="%3Cstyle%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20div%20%23fb%2C%20div%20%23gp%2C%20div%20%23tw%7Bdisplay%3A%20inline-block%3B%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%23fb%7Bwidth%3A%20180px%3B%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%23gp%7Bwidth%3A%20%20100px%3B%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%23tw%7Bwidth%3A%20180px%3B%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fstyle%3E" data-mce-resize="false" data-mce-placeholder="1" class="mce-object" width="20" height="20" alt="&lt;style&gt;" title="&lt;style&gt;" />
<div id="fb">
<iframe src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2Fwebrocom.learn&amp;width&amp;layout=button_count&amp;action=like&amp;show_faces=false&amp;share=true&amp;height=21&amp;appId=1464599523806855" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:21px;" allowTransparency="true"></iframe>
</div>
<div id="tw">
<a href="https://twitter.com/Meul Tech classes" class="twitter-follow-button" data-show-count="false" data-size="medium">Follow @Meul Tech classes</a>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-wp-preserve="%3Cscript%3E!function(d%2C%20s%2C%20id)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20var%20js%2C%20fjs%20%3D%20d.getElementsByTagName(s)%5B0%5D%2C%20p%20%3D%20%2F%5Ehttp%3A%2F.test(d.location)%20%3F%20’http’%20%3A%20’https’%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(!d.getElementById(id))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20js%20%3D%20d.createElement(s)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20js.id%20%3D%20id%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20js.src%20%3D%20p%20%2B%20’%3A%2F%2Fplatform.twitter.com%2Fwidgets.js’%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20fjs.parentNode.insertBefore(js%2C%20fjs)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D(document%2C%20’script’%2C%20’twitter-wjs’)%3B%3C%2Fscript%3E" data-mce-resize="false" data-mce-placeholder="1" class="mce-object" width="20" height="20" alt="&lt;script&gt;" title="&lt;script&gt;" /></div>
<div id="gp">
<!– Place this tag in your head or just before your close body tag. –>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-wp-preserve="%3Cscript%20src%3D%22https%3A%2F%2Fapis.google.com%2Fjs%2Fplatform.js%22%20async%20defer%3E%3C%2Fscript%3E" data-mce-resize="false" data-mce-placeholder="1" class="mce-object" width="20" height="20" alt="&lt;script&gt;" title="&lt;script&gt;" />
<!– Place this tag where you want the +1 button to render. –>
<div class="g-plusone" data-href="https://plus.google.com/+WebrocomNetwebrocom/about"></div>
</div>
</div>
</div>
<div class="row clear_fix"><div class="col-md-12">
<div id="response"></div>
<div class="well">
<form class="form-inline" role="form" id="frmadd" action="<?php echo base_url() ?>
home/create" method="POST">
<div class="form-group">
<label class="sr-only" for="exampleInputEmail2">Full name</label>
<input type="text" name="name" class="form-control" id="exampleInputEmail2" placeholder="name">
</div>
<div class="form-group">
<div class="input-group">
<div class="input-group-addon">@</div>
<input class="form-control" name="email" type="email" placeholder="Enter email">
</div>
</div>
<div class="form-group">
<label class="sr-only" for="exampleInputPassword2">Contact</label>
<input type="text" class="form-control" name="contact" id="exampleInputPassword2" placeholder="contact number">
</div>
<div class="form-group">
<label class="sr-only" for="exampleInputPassword2">facebook link</label>
<input type="text" name="facebook" class="form-control" id="exampleInputPassword2" placeholder="http://facebook.com/pariharvikram1989">
</div>
<div class="form-group">
<input type="submit" class="btn btn-success" id="exampleInputPassword2" value="submit">
</div>
</form>
</div>
<table class="table">
<thead><tr>
<th>Name</th>
<th>Email</th>
<th>Contact</th>
<th>facebook link</th>
<th>created</th>
<th>Action</th></tr></thead>
<tbody id="fillgrid">
</tbody>
<tfoot></tfoot>
</table>
</div>
</div>
</div><img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-wp-preserve="%3Cscript%3E%0A%24(document).ready(function%20()%7B%0A%20%20%20%20%2F%2Ffill%20data%0A%20%20%20%20var%20btnedit%3D”%3B%0A%20%20%20%20var%20btndelete%20%3D%20”%3B%0A%20%20%20%20%20%20%20%20fillgrid()%3B%0A%20%20%20%20%20%20%20%20%2F%2F%20add%20data%0A%20%20%20%20%20%20%20%20%24(%22%23frmadd%22).submit(function%20(e)%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20e.preventDefault()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%24(%22%23loader%22).show()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20var%20url%20%3D%20%24(this).attr(‘action’)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20var%20data%20%3D%20%24(this).serialize()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%24.ajax(%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20url%3Aurl%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20type%3A’POST’%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20data%3Adata%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D).done(function%20(data)%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24(%22%23response%22).html(data)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24(%22%23loader%22).hide()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20fillgrid()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D)%3B%0A%20%20%20%20%20%20%20%20%7D)%3B%0A%20%20%20%20%20%0A%20%20%20%20%20%0A%20%20%20%20%20%0A%20%20%20%20function%20fillgrid()%7B%0A%20%20%20%20%20%20%20%20%24(%22%23loader%22).show()%3B%0A%20%20%20%20%20%20%20%20%24.ajax(%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20url%3A’%3C%3Fphp%20echo%20base_url()%20%3F%3Ehome%2Ffillgrid’%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20type%3A’GET’%0A%20%20%20%20%20%20%20%20%7D).done(function%20(data)%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%24(%22%23fillgrid%22).html(data)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%24(%22%23loader%22).hide()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20btnedit%20%3D%20%24(%22%23fillgrid%20.btnedit%22)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20btndelete%20%3D%20%24(%22%23fillgrid%20.btndelete%22)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20var%20deleteurl%20%3D%20btndelete.attr(‘href’)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20var%20editurl%20%3D%20btnedit.attr(‘href’)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%2F%2Fdelete%20record%0A%20%20%20%20%20%20%20%20%20%20%20%20btndelete.on(‘click’%2C%20function%20(e)%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.preventDefault()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20var%20deleteid%20%3D%20%24(this).data(‘id’)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if(confirm(%22are%20you%20sure%22))%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24(%22%23loader%22).show()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24.ajax(%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20url%3Adeleteurl%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20type%3A’POST’%20%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20data%3A’id%3D’%2Bdeleteid%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D).done(function%20(data)%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24(%22%23response%22).html(data)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24(%22%23loader%22).hide()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20fillgrid()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%2F%2Fedit%20record%0A%20%20%20%20%20%20%20%20%20%20%20%20btnedit.on(‘click’%2C%20function%20(e)%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.preventDefault()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20var%20editid%20%3D%20%24(this).data(‘id’)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24.colorbox(%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20href%3A%22%3C%3Fphp%20echo%20base_url()%3F%3Ehome%2Fedit%2F%22%2Beditid%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20top%3A50%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20width%3A500%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20onClosed%3Afunction()%20%7Bfillgrid()%3B%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%0A%20%20%20%20%20%20%20%20%7D)%3B%0A%20%20%20%20%7D%0A%20%20%20%20%20%0A%7D)%3B%0A%3C%2Fscript%3E" data-mce-resize="false" data-mce-placeholder="1" class="mce-object" width="20" height="20" alt="&lt;script&gt;" title="&lt;script&gt;" />
</body>
</html>
[/code]

 

Step 6

And finally Paste the following code in edit.php view.

[code]
<div class="well">
<div class="errorresponse">
</div>
<form class="form" id="frmupdate" role="form" action="<?php echo base_url() ?>
home/update" method="POST">
<?php foreach($query->result() as $row):?>
<div class="form-group">
<label for="exampleInputEmail2">Full name</label>
<input type="text" name="name" class="form-control" value="<?php echo $row->name?>">
</div> <div class="form-group">
<label for="exampleInputEmail2">Email</label>
<input class="form-control" name="email" type="email" value="<?php echo $row->email?>" >
</div>
<div class="form-group">
<label for="exampleInputPassword2">Contact</label>
<input type="text" class="form-control" name="contact" value="<?php echo $row->contact?>">
</div>
<div class="form-group">
<label for="exampleInputPassword2">facebook link</label>
<input type="text" name="facebook" class="form-control" value="<?php echo $row->facebook_link?>">
</div>
<div class="form-group">
<input type="hidden" name="hidden" value="<?php echo $id ?>"/>
<input type="submit" class="btn btn-success" id="exampleInputPassword2" value="update">
</div>
<?php endforeach;?>
</form>
</div>
</div>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-wp-preserve="%3Cscript%3E%0A%24(document).ready(function%20()%7B%0A%20%20%20%20%24(%22%23frmupdate%22).submit(function(e)%7B%0A%20%20%20%20%20%20%20%20e.preventDefault()%3B%0A%20%20%20%20%20%20%20%20%24.ajax(%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20url%3A’%3C%3Fphp%20echo%20base_url()%20%3F%3Ehome%2Fupdate’%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20type%3A’POST’%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20dataType%3A’json’%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20data%3A%20%24(%22%23frmupdate%22).serialize()%0A%20%20%20%20%20%20%20%20%7D).done(function%20(data)%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20window.mydata%20%3D%20data%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if(mydata%5B’error’%5D%20!%3D%22%22)%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24(%22.errorresponse%22).html(mydata%5B’error’%5D)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20else%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24(%22.errorresponse%22).text(”)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24(‘%23frmupdate’)%5B0%5D.reset()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24(%22%23response%22).html(mydata%5B’success’%5D)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24.colorbox.close()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24(%22%23response%22).html(mydata%5B’success’%5D)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D)%3B%0A%20%20%20%20%7D)%3B%20%20%20%20%0A%7D)%3B%0A%20%0A%20%20%20%20%20%0A%3C%2Fscript%3E" data-mce-resize="false" data-mce-placeholder="1" class="mce-object" width="20" height="20" alt="&lt;script&gt;" title="&lt;script&gt;" />
</body>
</html>
[/code]

So finally your code is ready to run. Thanks and enjoy your code.

Don’t forget to share your doubts in the comment box and also share this post on social media and with your friends becaus“You share, I share, let’s make the world aware”.

You may want to take a look at the following related posts:

Also for more awesome tutorials, please don’t forget to like our facebook page Meul Tech .
Bonus: We also give training on following topics:

                       1. Angular Training in Mumbai.

2. Bootstrap Training Course in Mumbai.

3.  Web Designing Training in Mumbai.

4. UI / UX Training.

5. IOS Training Institute in Mumbai.