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
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
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();
}
<!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!
First, in your controller you are trying to call a method that may not exist:
$data = $this->Crudmodel->fetch();
Because in your model the method is named "fetch_data". So I think you intend to do this:
$data = $this->Crudmodel->fetch_data();
Second, you are not passing the query parameter to your model's method. It should be like this:
$data = $this->Crudmodel->fetch_data( $query );
These are two essential things that should help get you started.
Also note that it is not shown if crudmodel is loaded. You may need:
$this->load->model('crudmodel');
When you have a Crudmodel loaded, you don't need to uppercase your object usage. So in the end, you should probably have this line:
$data = $this->crudmodel->fetch_data( $query );
Besides the problems I pointed out in my other answer, I thought I'd help by cleaning things up a bit. Although not tested, this might help:
How about this:
public function fetch()
{
$data = $this->crudmodel->fetch_data();
echo $this->load->view('snippet', ['data' => $data], TRUE );
}
$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( ! empty( $data ) )
{
foreach($data 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;
public function fetch_data()
{
$query = $this->input->post('query');
$this->db->from("employees");
if( ! empty($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','ASC');
$data = $this->db->get();
if( $data->num_rows() > 0 )
return $data->result();
return NULL;
}
<script>
$(document).ready(function () {
load_data();
function load_data(query)
{
if(query == undefined)
query = '';
$.ajax({
url: "<?php echo site_url('crud/fetch'); ?>",
method: "POST",
data: {'query': query},
dataType: "html",
success: function (data) {
$('#result').html(data);
}
})
}
$('#search_text').keyup(function () {
var search = $(this).val();
if (search != '')
{
load_data(search);
} else
{
load_data();
}
});
});
</script>