I’m doing search data without refreshing the page but I don’t get any request responses. I tried editing my ajax code but nothing happens. I just started learning ajax yesterday so its new to me. Is it on my ajax code or is it on my controller? I even have my ajax link included.
Here is my view code:
<html>
<head>
<meta charset="utf-8">
<title>CRUD Practice</title>
<style type="text/css">
*{
font-family: helvetica;
}
a{
text-decoration: none;
margin-top: 50px;
}
</style>
<script
src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<body>
<h2>Search: <input type="text" name="search_text" placeholder="Enter your query" id="search_text"></h2>
<h1>Admin Dashboard</h1>
<a href="get_all">Get all data</a><br>
<a href="get_id/(:num)">Get data by ID</a><br>
<a href="add_view">Add data</a>
<div id="result"></div>
<a href="<? echo base_url() ?>">Go Back</a>
<script>
$(document).ready(function(){
load_data();
function load_data(query){
$.ajax({
url:"<?php echo base_url()?>crud_controller/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>
</body>
</html>
Here is my controller:
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Crud_controller extends CI_Controller {
public function __construct(){
parent::__construct();
$this->load->model('Crud_model', 'crud');
$this->load->helper('url');
}
public function index(){
$this->load->view('crud_view');
}
function fetch(){
$this->load->model('Crud_model');
$output='';
$query='';
if($this->input->post('query')){
$query = $this->input->post('query');
}
$data = $this->Crud_model->fetch_data($query);
$output .= '
<table>
<th>Name</th>
<th>Description</th>
<th>Created_at</th>
';
if($data->num_rows() > 0){
foreach ($data->result() as $row)
{
$output .= '<tr>
<td>'.$row->name.'</td>
<td>'.$row->description.'</td>
<td>'.$row->created_at.'</td>
<td>'.$row->updated_at.'</td>
</tr>';
}
}else{
$output .= '<tr><td> No Data Found </td></tr>';
}
}
2
Answers
I found some missing content in your code that I mention below.
So you first need to add the
json_encode
like thisecho json_encode($output);
at the end of the controller function.Change your function be like this:
Your code is fine but you have to display your $output variable.
without printing the variable ajax cant read the data from php.
For our reference:
echo output;