CODEWITHSUNDEEP
phpjqueryajaxdatabasecodeigniter
Liam Jay
Liam Jay

Reputation: 37

Retrieving Data from a database in codeigniter using AJAX

The Plan

The plan I've got is to use JQUERY to retrieve input from three fields inside the view. Then use AJAX to send that input to the controller, which in turn sends that data the model. To be used to retrieve data, send the result back to the .js file and then amend a table to display the data inside the view.

The Problem

Looking through my code, it doesn't look like the data isn't being sent from the .js file to the controller. I think this because the data from the database isn't being displayed inside the amended table. Also, when I put an echo inside the controller to be sent back to the .js to trigger an alert, to see if the AJAX was successful. Nothing happens.

My Javascript Code

 $('#bttnSubmit').click(function() {
        // Gather the input from the view and place them into variables
        var company = $('#client :selected').val();
        var dateFrom = $('#dateFrom').val();
        var dateTo = $('#dateTo').val();

        if (company != "") {
            var post_url = "http://localhost/ProjectSage/index.php/site/members_area";

            $.ajax ({
                type: "POST",
                url: post_url,
                cache: false,
                data: "company=" + company + "&dateFrom=" + dateFrom + "&dateTo=" + dateTo,
                success: function(invoices) {
                    $.each(invoices, function(InvoiceID, CompanyName, InvRef, InvDate, InvTotal, SageReference){
                        $('.invoice_tbody').append('<tr>');
                            $('.invoice_tbody').append('<td class="invoice_td">' + InvoiceID + '</td>');
                            $('.invoice_tbody').append('<td class="invoice_td">' + CompanyName + '</td>');
                            $('.invoice_tbody').append('<td class="invoice_td">' + InvRef + '</td>');
                            $('.invoice_tbody').append('<td class="invoice_td">' + InvDate + '</td>');
                            $('.invoice_tbody').append('<td class="invoice_td">' + InvTotal + '</td>');
                            $('.invoice_tbody').append('<td class="invoice_td">' + SageReference + '</td>');
                        $('.invoice_tbody').append('</tr>');
                    });
                } // End of success
            }) // End of AJAX method
        } else {
            alert("You need to select an input first!!!");
        } // End of if statement
    }); // End of click function

My Controller Function Code

  function get_invoices() {
  // Retrieve the data sent from the .js file using _POST method
  $company = $_POST['company'];
  $dateFrom = $_POST['dateFrom'];
  $dateTo = $_POST['dateTo'];

  // Load invoice_model
  // Initialise the JSON header
  // Encode the response using the parameters sent from the .js file and send it back to the .js file
  $this->load->model('invoice_model');
  header('Content-Type: application/x-json; charset=utf-8');
  echo(json_encode($this->invoice_model->get_invoices($company, $dateFrom, $dateTo)));
 }

My Model Function Code

function get_invoices($company, $dateFrom, $dateTo) {

// Query to retrieve data from database
// Sent it back to the controller to be populated into a table

$ONEDB = $this->load->database('ONEDB', TRUE);
$ONEDB->select('InvoiceID, CompanyName, InvRef, InvDate, InvTotal, SageReference'); 
$ONEDB->where('ClientID', $company);
$ONEDB->where('InvDate >=', $dateFrom);
$ONEDB->where('InvDate <=', $dateTo);
$ONEDB->join('Supplier', 'Supplier.SupplierName = InvDetail.InvSupplier');

$query = $ONEDB->get('InvDetail');

$result = $query->result();

return $result;

}

Question

Does anybody know where I have gone wrong and what the fix to my problem is???

Thanks

Upvotes: 1

Views: 8267

Answers (5)

CodeGodie
CodeGodie

Reputation: 12132

ok, lets start from scratch. 1)On your JS, place an alert after:

var company = $('#client :selected').val();
    var dateFrom = $('#dateFrom').val();
    var dateTo = $('#dateTo').val();
ALERT(company, dateFrom, dateTo );

see if the variables have data. If so, proceed. 2)check the url. paste your url on the browser and see if the controller is actually being called. if it isnt, fix that url.

3)change your ajax call to jquery, its simpler.Also add an alert in your success code.

var url = "http://...";
var dataToSend= {company: company, dateFrom: dateFrom.....};
    $.post(url, dataToSend, function(data) {

       ALERT(data);

    });

4) on PHP controller, test if data is being received like so:

function get_invoices() {
  $company = $this->input->post('company');
  $dateFrom= $this->input->post('dateFrom');
  $dateTo= $this->input->post('dateTo');

  echo $company; 
  echo $dateFrom; 
  echo $dateTo;

}

5) what do you get?

Upvotes: 1

CodeGodie
CodeGodie

Reputation: 12132

hmmm.. try changing your ajax call to this:

var url = "http://...";
var dataToSend= {company: company, dateFrom: dateFrom.....};
    $.post(url, dataToSend, function(data) {

       ...sucess code

    });

Upvotes: 0

bipen
bipen

Reputation: 36531

my doubt is..the set path to your controller function is not correct

your url to post the data is

var post_url = "http://localhost/ProjectSage/index.php/site/members_area";

where as your controller function is

function get_invoices() {
 ....

the ajax url options , path should point to your contoroller function which i doubt it is pointing, here in your code.

no sure but i think it should be

var post_url = "http://localhost/ProjectSage/index.php/site/members_area/get_invoices";

if members_area is you controller here.

and better to send data as objects.

 data: {"company":company,"dateFrom":dateFrom,"dateTo":dateTo},

you don't need to use content type when using echo json_encode.

$this->load->model('invoice_model');
echo json_encode($this->invoice_model->get_invoices($company, $dateFrom, $dateTo));

Upvotes: 0

CodeGodie
CodeGodie

Reputation: 12132

I think the problem is how you are sending your data to the controller. in your AJAX call you have the following:

$.ajax({
   type: "POST",
   url: post_url,
   cache: false,
   data: "company=" + company + "&dateFrom=" + dateFrom + "&dateTo=" + dateTo,
 });

you are sending the data in GET format.. in order for PHP to receive the post you should do the following:

$.ajax({
   type: "POST",
   url: post_url,
   cache: false,
   data: {company: company, dateFrom:dateFrom , dateTo:dateTo}
 });

also, in your controller, try using Codeigniter's helpers as such:

$company = $this->input->post('company');
$dateFrom= $this->input->post('dateFrom');
$dateTo= $this->input->post('dateTo');

Upvotes: 0

Blasius Secundus
Blasius Secundus

Reputation: 171

You should define an error function in $.ajax call. So you'll see if you get an Internal Server Error, which is possible too.

Also, you may have CSRF protection enabled in CodeIgniter, so you also have to pass CSRF hash to the server.

Upvotes: 0

Related Questions