Jump to content

Live Search using Jquery (json) with Codeigniter


skemi90

Recommended Posts

Hi, 

I have a problem with $.getJSON function. I am using Codeigniter.
My main problem is in view. In console, when typing in search input, I get error 403 forbiden, but variable $test is geting json parameters from database. I am a beginner in jquery.
 
Main goal for this is to make a live search with json.
 
Thanks in advance for any help.
 
Controller code:
class Test extends CI_Controller{  
public function index()
    {
    $data['test'] = $this->Test_model->get('id', 'DESC', 10);

        $this->load->view('home/inc/header_view');
        $this->load->view('home/test',$data);
        $this->load->view('home/inc/footer_view');
    }
}

Model code:

<?php
class Test_model extends CI_Model {
 public function get($order_by = null, $sort = 'DESC', $limit = null, $offset = 0) {

        $this->db->select('*');
        $this->db->from('prevoznici');

        if ($limit != null){
            $this->db->limit($limit, $offset);
        }
        if ($order_by != null){
            $this->db->order_by($order_by, $sort);
        }
        $query = $this->db->get();
 return json_encode($query->result());
    }
}

View Code (mix of php and javascript):

<div id="searcharea">
            <label for="search">Search</label>
            <p>Enter name</p>
        <input id="search" type="search" name="search" placeholder="Name or info">
    </div>
        <div id="update"></div>
               
        <script src="<?=  site_url()?>public/js/jquery.js"></script>
        <script src="<?=  site_url()?>public/js/jqueryjsonp.js"></script>
        <script type="text/javascript">
        
        $('#search').keyup(function(){
    var searchField = $('#search').val();
    var myExp = new RegExp(searchField, "i");
    var json = '<?= $test;?>';
    $.getJSON(json, function(data){
            var output = '<ul class="searchresults" >';

                $.each(data, function(key, val){
                    if((val.naziv.search(myExp) != -1) || (val.datum.search(myExp) != -1))
                        {
                            output += '<li>';
                            output += '<h2>' + val.naziv + '</h2>';
                            output += '<p>' + val.datum + '</p>';
                            output += '</li>';
                        }
                });

            output += '</ul>';
            $('#update').html(output);
    }).error(function() { alert("error"); });
});
</script>

 

Scootash WERE ARE YOU YESTERDAY????  :  :happy-04:

Just joking, big thanks!

 

For others, maybe someone will have a simmilar problem. In controller add a function:

public function search() {
        $data['test'] = $this->Test_model->get('id', 'DESC', 10);
        $this->load->view('home/test1', $data);
    } 

On page (test1) echo the json result (echo $test;)

 

And in view for test, change var json to that new function search in controller:

var json = '<?=  site_url('test/search');?>'; 

And you have a simple json live search.

 

Thanks again scootash!!!

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.