CodeIgniter Forums
Newbie: CodeIgniter, JQuery & Ajax - Not returning/displaying values - Printable Version

+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Archived Discussions (https://forum.codeigniter.com/forumdisplay.php?fid=20)
+--- Forum: Archived Development & Programming (https://forum.codeigniter.com/forumdisplay.php?fid=23)
+--- Thread: Newbie: CodeIgniter, JQuery & Ajax - Not returning/displaying values (/showthread.php?tid=42494)

Newbie: CodeIgniter, JQuery & Ajax - Not returning/displaying values - El Forum - 06-08-2011

[eluser]ShawnMA[/eluser]
I'm attempting to following the tutorials found here: www.ifadey.com/2010/06/crud-using-jquery-and-codeigniter/

My code is updated to accomodate for CI and JQ updates. But when attempting to load data from my db and display it in my view, nothing happens/is displayed. All links to javascript (JQ) code work and everything is running locally on my Mac.

If I edit my controller function to include $this->load->model('mUsers'); prior to the echo json_encode, and then I paste the URL in directly to access the controller (CI/index.php/site/read) I finally get data returned as:

[{"id":"1","name":"Fawad Hassan","email":"[email protected]"},{"id":"2","name":"Bill Gates","email":"[email protected]"},{"id":"3","name":"Steve Jobs","email":"[email protected]"},{"id":"4","name":"Naveed Ahmad","email":"[email protected]"},{"id":"5","name":"Mr Zee","email":"[email protected]"}],

but still cannot get it to load into the display.

Any and all help is greatly appreciated. Note: Exact links removed by forums so I could post this:

My code is as follows

Model:

Code:
<?php
class mUsers extends CI_Model {
    public function getAll() {

        //get all records from users table
         $this->db->_compile_select();  
        $query=$this->db->get('users')->result();        
        //OR $query = $this->db->get('users');
        echo $this->db->last_query();

        if( $query->num_rows() > 0 ) {
            return $query->result();
        } else {
            return array();
        }

    } //end getAll

} //end class
?>

Controller:

Code:
<?php
class Site extends CI_Controller{
   public function index(){
       $this->load->model('mUsers');      
       $this->load->view('home');
   }

public function read(){
     header('Content-Type: application/json',true);
     echo json_encode($this->mUsers->getAll());

}

}

?>

View:

Code:
<html>
<head>
    <title>Test</title>

        /*REMOVED CSS / JQUERY CSS LINKS */


</head>
<body>


    <div id="tabs">

    <ul>
        <li><"#read">Read</li>
        <li><"#create">Create</li>
    </ul>

    <div id="read">
        <table id="records"></table>
    </div>

    <div id="create">Create form goes here...</div>

</div> &lt;!-- end tabs --&gt;


[removed][removed]
[removed][removed]
[removed][removed]

/*JQuery links here */

[removed]
        <tr>
            <td>${id}</td>
            <td>${name}</td>
            <td>${email}</td>
        </tr>
    [removed]


[removed][removed]

/*all.js would be here, see below */

&lt;/body&gt;
&lt;/html&gt;

all.js:

Code:
$( function() {
    $.ajax({
        url: 'index.php/site/read',
        dataType: 'json',
        success: function( response ) {
            $( '#readTemplate' ).render( response ).appendTo( "#records" );
        }
    });
});


Newbie: CodeIgniter, JQuery & Ajax - Not returning/displaying values - El Forum - 06-08-2011

[eluser]cideveloper[/eluser]
Just a quick tip. Do you have firefox and firebug installed. They work great for debugging ajax calls. The net tab will show you if the calls are being made, if they fail or not, and the results of the calls. That way you can at least see if the result is being returned to the browser. Then you can move on to see if the render plugin is working properly

Newbie: CodeIgniter, JQuery & Ajax - Not returning/displaying values - El Forum - 06-09-2011

[eluser]ShawnMA[/eluser]
Thanks. I installed Firebug, and now have been able to identify the following issue(s), but am not quite clear on how to resolve them:

".render is not a function" in the following line of code:

Code:
$( '#readTemplate' ).render( response ).appendTo( "#records" );


So I downloaded jquery.render.js, which takes care of the render error, but I now get ".replace is not a function" on the following line(s):
Code:
return tem.replace( /\$\{([^\}]+)\}\.each\(([^\)]+)\)/g, function( w, k, t )

I tried replaceTo, but that didn't work. All help is appreciated.

Newbie: CodeIgniter, JQuery & Ajax - Not returning/displaying values - El Forum - 06-09-2011

[eluser]ShawnMA[/eluser]
Resolved:

Instead of using .render in my ajax call, needed to use .tmpl:

Code:
$.ajax({
        url: 'index.php/site/read',
        dataType: 'json',
        success: function( response ) {
             $( '#readTemplate' ).tmpl( response ).appendTo( "#records" );