How to search using ajax in codeigniter?

Question

Controller (invoice_invoice.php)

<?php

function sent() {
    if (!null($this->input->get('id'))) {
        $limit_per_page = 10;
        $page = ($this->uri->segment(3)) ? ($this->uri->segment(3) - 1) : 0;
        $total_records = $this->invoice_model->get_total_search($this->input->get('id'));
        if ($total_records > 0) {
            $params = array();
            $params['content'] = $this->invoice_model->search($this->input->get('id'), $limit_per_page, $page * $limit_per_page);

            //print_r($data);
            //exit;
            //$abc =  count($data['content']);
            $config['base_url'] = site_url() . '/invoice_invoice/sent';
            $config['total_rows'] = $total_records;
            $config['per_page'] = $limit_per_page;
            $config["uri_segment"] = 3;

            $config['num_links'] = 2;
            $config['use_page_numbers'] = TRUE;
            $config['reuse_query_string'] = TRUE;

            $config['full_tag_open'] = '<div class="pagination dataTables_paginate paging_bootstrap_number" id="sample_3_paginate"> <ul class = "pagination" style = "visibility : visible;">';
            $config['full_tag_close'] = '</ul></div>';

            /*  $config['first_link'] = 'First Page';
              $config['first_tag_open'] = '<span class="firstlink">';
              $config['first_tag_close'] = '</span>'; */

            //$config['last_link'] = 'Last Page';
            //$config['last_tag_open'] = '<span class="lastlink">';
            //$config['last_tag_close'] = '</span>';

            $config['next_link'] = '<i class="fa fa-angle-right"></i>';
            $config['next_tag_open'] = '<li class = "next">';
            $config['next_tag_close'] = '</li>';

            $config['prev_link'] = '<i class="fa fa-angle-left"></i>';
            $config['prev_tag_open'] = '<li class = "prev">';
            $config['prev_tag_close'] = '</li>';

            $config['cur_tag_open'] = '<li class = "active"><a>';
            $config['cur_tag_close'] = '</a></li>';

            $config['num_tag_open'] = '<li>';
            $config['num_tag_close'] = '<li>';

            $this->pagination->initialize($config);

            // build paging links
            $params["links"] = $this->pagination->create_links();
        }
    } 
}

My controller is taking call of id from the jquery to run it.

Here is my jquery

$(document).ready(function () {
    $("#search").keyup(function () {
        var str = $("#search").val();
        if (str != "") {
            console.log(str);
            $.get("<?php echo base_url();?>invoice_invoice/sent?id=" + str, function (data) {
                $("#sample_1").html(data);
            });
        }
    });
});

sample_1 is the id of my table where i want to print the values coming from the search

Here is the view with the search block

<div class="row">
<div class="col-md-6 col-sm-6"><div 
class="dataTables_length" id="sample_2_length">
<label>Show <select 
name="sample_2_length" aria-controls="sample_2" class="form-control input-sm 
input-xsmall input-inline">
<option value="5">5</option>
<option value="15">15</option>
<option value="20">20</option><option value="-1">All</option>
</select>
</label>
 </div>
</div>
<div class="col-md-6 col-sm-6"><div id="sample_2_filter" 
class="dataTables_filter">
<label>Search:
<input type="search" id ='search' name = 'search' class="form-control input-
sm input-small input-inline" placeholder="" aria-controls="sample_2">
</label>
</div>
</div>
</div>

Hereby is the model function

function search($search,$limit,$start)
{
    $userdata1 = $this->session->userdata('condition');
    $this->db->select("'id,Client_Name,ac_email,Client_email,Invoice_no,Items,client_add,Currency,Language,Notes'");
    $whereCondition = array('Client_email' =>$search , 'ac_email' => $userdata1['ac_email'] );
    $this->db->where($whereCondition);
    $this->db->from('invoices');
    $params = $this->db->get();
    return $params->result();
}

I just want to search my data in the database and print it to the view . I have created the view as well as pagination is done but cant make the search going well. I just get "GET http://localhost/cidemo/invoice_invoice/sent?id=weqe@dsf 404 (Not Found)" error in my console where I run my search view

Possible duplicate of [Making live search on a database with CodeIgniter, php5 and MySQL](https://stackoverflow.com/questions/37878850/making-live-search-on-a-database-with-codeigniter-php5-and-mysql) — Mayank Vadiya, Jan 18 '18 at 11:44
Does the url `http://localhost/cidemo/invoice_invoice/sent?id=weqe@dsf` actually work if you just browse to it? — ourmandave, Jan 18 '18 at 11:56
Better not to display search result with pagination. In this case what happens is pagination buttons wont work because ` $config['base_url'] ` is initialized without the query string. You can go for using autocomplete for text box to search items. — Shashidhara, Jan 18 '18 at 13:00

score 0 · Answer 1 · edited Jan 18 '18 at 12:16

in java

$.ajax({
    type: "post",
    url: url,
    data: formData,
    processData: false,
    contentType: false,
    success: function (data) {
        console.log(JSON.stringify(data.revalformbean));
        //console.log(JSON.stringify(data.examformbean.full_name));
        $("input[type='hidden'][name='revalformbean.exam_detail_id']").val(data.revalformbean.exam_detail_id);
        //$("input[type='hidden'][name='examformbean.full_name']").val(data.examformbean.full_name);
        $("input[name='revalformbean.name']").val(data.revalformbean.first_name);
        $("input[name='revalformbean.month_year']").val(data.revalformbean.exam_month_year);
        $("input[name='revalformbean.seat_no']").val(data.revalformbean.seat_no);

        var errorMsg = data.errorMsg;
        //console.log("form "+errorMsg);
        //json2array(data.customResult);
        if (errorMsg != null) {
            //alert(errorMsg);
            $('#errorField').text(data.errorMsg);
            $('#' + formId).find('input[type="submit"]').removeAttr('disabled');
        } else {
            fieldSetHide(formId);
        }
    }
});

score 0 · Answer 2 · edited Jan 19 '18 at 11:25

In your sent method of invoice_invoice controller

You're setting:

$config['base_url'] = site_url() . '/invoice_invoice/sent';

which makes your base URL: http://localhost/cidemo/invoice_invoice/sent

And then doing this in your JS:

P.S: I am assuming that your JS function is define in .php file encapsulated in a <script> tag.

$.get("<?php echo base_url();?>invoice_invoice/sent?id=" + str, function (data) {
    $("#sample_1").html(data);
});

which in turn make your get function look like:

$.get("http://localhost/cidemo/invoice_invoice/sent/invoice_invoice/sent?id=" + str, function (data) {
    $("#sample_1").html(data);
});
// OR http://localhost/cidemo/invoice_invoice/sentinvoice_invoice/sent    
// if taking on account the **absence** of trailing slash

See the definition of controller and its method twice, Hence the 404

How to search using ajax in codeigniter?

sample_1 is the id of my table where i want to print the values coming from the search

2 Answers2