Login

06-08-2011, 08:40 PM

[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:
&lt;?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

?&gt;

Controller:

Code:
&lt;?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());

 }

}

?&gt;

View:

Code:
&lt;html&gt;

&lt;head&gt;

    &lt;title&gt;Test&lt;/title&gt;

        /*REMOVED CSS / JQUERY CSS LINKS */

&lt;/head&gt;

&lt;body&gt;

    <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" );

        }

    });

});

06-08-2011, 11:37 PM

[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

06-09-2011, 09:48 AM

[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.

06-09-2011, 12:48 PM

[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" );