I am a fresh graduate I am studying Codeigniter for the first time and I am having a hard time pls help me to fix my issue. I created a system that records employees information. I included a live search in my code. There are no error in syntax but there is no results shown. Below is my code.
Here is the controller. It's file name is Crud.php
Controller
public function fetch()
{
$output = '';
$query = '';
if($this->input->post('query'))
{
$query = $this->input->post('query');
}
$data = $this->Crudmodel->fetch();
$output .= '
<div class="table-responsive">
<table class="table table-bordered">
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Job Title</th>
</tr>
';
if($data->num_rows() > 0)
{
foreach($data->result() as $row)
{
$output .= '
<tr>
<td>'.$row->fname.'</td>
<td>'.$row->lname.'</td>
<td>'.$row->job_title.'</td>
</tr>
';
}
}
else
{
$output .= '<tr>
<td colspan="5">No Data Found</td>
</tr>';
}
$output .= '</table>';
echo $output;
}
Here is the model. File name: Crudmodel.php
Model
public function fetch_data($query){
$this->db->select("*");
$this->db->from("employees");
if($query != ''){
$this->db->or_like('fname', $query);
$this->db->or_like('lname', $query);
$this->db->or_like('job_title', $query);
}
$this->db->order_by('id');
return $this->db->get();
}
View
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>
<div class="row">
<div class="col-lg-12 margin-tb">
<div class="pull-left">
<h2>Employee Registation</h2>
</div><br>
<div class="pull-right">
<a class="btn btn-success" href="<?php echo base_url('crud/create') ?>"> Add Employee</a>
<a type="button" class="btn btn-danger" href="crud/logout">Logout</a>
</div>
</div>
</div>
<div class="form-group">
<div class="input-group">
<span class="input-group-addon">Search</span>
<input type="text" name="search_text" id="search_text" placeholder="Search Employee" class="form-control" />
</div>
</div>
<div id="result"></div>
<div style="clear:both"></div>
<table class="table table-bordered">
<thead>
<tr>
<!-- <th>Full Name</th> -->
<th>First Name</th>
<th>Last Name</th>
<th>Job Title</th>
<th width="220px">Action</th>
</tr>
</thead>
<tbody>
<?php foreach ($data as $employees)
{
?>
<tr>
<td> <?php echo $employees->fname; ?></td>
<td> <?php echo $employees->lname; ?></td>
<td> <?php echo $employees->job_title; ?></td>
<td>
<form method="DELETE" action="<?php echo base_url('crud/delete/'.$employees->id); ?>">
<a class="btn btn-info" href="<?php echo base_url('crud/show/'.$employees->id) ?>"> View</a>
<a class="btn btn-primary" href="<?php echo base_url('crud/edit/'.$employees->id) ?>"> Edit</a>
<button type="submit" class="btn btn-danger"> Delete</button>
</form>
</td>
</tr>
<?php } ?>
</tbody>
</table>
</body>
</html>
<script>
$(document).ready(function () {
load_data();
function load_data(query)
{
$.ajax({
url: "<?php echo base_url('crud/fetch'); ?>",
method: "POST",
data: {query: query},
success: function (data) {
$('#result').html(data);
}
})
}
$('#search_text').keyup(function () {
var search = $(this).val();
if (search != '')
{
load_data(search);
} else
{
load_data();
}
});
});
</script>
Please help me to figure it out. Your help will be appreciated!