How To CodeIgniter, jQuery & JSON
I shot this screen for those who are looking for an extremely simple explanation and demonstration for sending and receiving data asynchronously via jQuery Post and JSON. About two years ago I really struggled with this concept so I figure there are probably others who will find this information useful. I would have been extremely happy to find something like this when I was learning (and frustrated).




Could you post, or give an example on how an multiple entries in the php array would be handled in the javascript.
If you are not talking about multidimensional arrays – consider the following :
// PHP
$arr = array(
‘key1′ => ‘value1′,
‘key2′ => ‘value2′,
‘key3′ => ‘value3′
);
// JS
$.post(“test.php”, { ‘request_var’ : ‘request_val’ },
function(data){
$(‘#some_div).append(data.key1); // value1
$(‘#some_div).append(data.key2); // value2
$(‘#some_div).append(data.key3); // value3
}, “json”);
Ha! Did you capture this between LAX and JFK from the cockpit? Thanks for the contribution
You can blame the juice – or me… for loving the juice,
Fantastic! Googled upon your bloggy goodness today (codeigniter + json) — exactly what I was looking for. Async has bedeviled, until now. Thanks mucho!
Hi! Very nice post!!! Helps a lot to make things clear!!! Thanks!!!
This was really helpful!! thankyou so much!
Thnx! Really good and easy to follow tut!
Thanks a lot, this post is very helpful.
I love xml over JSON[I have not bee working with JSON. lol]. my question is: Is it doable to return xml object instead of JSON?
Absolutely, replace “json” with “xml” and you are cooking with gas.
It must be a very amazing post. But I am in China, the damned G.F.W. blocked the youTube. Could you help me to give another download address in Google. Thank you!
No North American proxy eh?
No problem – just uploaded it for you here : http://is.gd/2KEEd
Thanks for the comment!
Tons of thanks
You are so generous.
By the way, could you mail me a proxy, haha
Rocky – just set up a cheapo dreamhost account or something then it is easy.
ssh -D 9090 user@domain
Then set your browser to use SOCKS5 proxy for localhost on port 9090.
Check out my post here : http://geekhut.org/2008/10/how-to-watch-american-television-in-canada/
Thanks a lot, this post is very helpful.
Thanks man,your post really helps..
Hi
Great post !! I have a question…
I’m seding an id to the controller. The controller loads a model and fetches all the products for that id. Then, I return the array with all the products.
Now, how can I add the returned products array with jQuery, into a < select > field ? (having cleared the list before doing the ajax call)
Thanks, and hope you’ve understood me… Enrique ( @kabeza )
Hi! nice tutorial! I have a question tough… My controller retrieves an array of objects (some rows from the database). Can you tell me how I can handle it in javascript? Thanks!
how would you do this with 30 checkboxes instead of 1 textfield?
With this
You guys asking about returning data from your model to your view – take a look at formtorch.geekhut.org
Thanks man, you really helped my get a grasp on this
hey this was fantastic post… im working on codeigniter n wanted to use jquery but had no idea how it would work.. after listening to ur video n creating it on my own.. it works.. excellent job
thanks a lot
Very useful post and a great, simple introduction to using JSON for returning arrays back to the front-end, with CodeIgniter. Thanks for taking the time to do this.
Thanks for this tutorial, it was really useful.
This is awesome! Thanks for the post!
You are very welcome.
I was very happy to find such a simple example, but for some reason I can’t make it work.
I believe that maybe I have some CodeIgniter configuration issues.
Do I need to add an ajax lib to CI?
Because the page by itself works just fine: http://192.168.8.138/index.php/main
And it displays: {“result”:”"}
But when I $.post to it, nothing happens…
(I used your exact code)
Thank you for the help.
I was very happy to find such a simple example, but for some reason I can\’t make it work.
I believe that maybe I have some CodeIgniter configuration issues.
Do I need to add an ajax lib to CI?
Because the page by itself works just fine: http://192.168.8.138/index.php/main
And it displays: {\"result\":\"\"}
But when I $.post to it, nothing happens…
(I used your exact code)
Thank you for the help.
Thanks for the tutorial man!! its what I needed!
i can NOT see the video.. that is flash?
Yep, YouTube does use Flash.
thx for a awsome tutorial !
Great tut, but I can’t seem to get it to work. I believe I copied everything exactly but am running into problems when it comes to returning the array from the controller. Phpinfo says that JSON is enabled on my server but I can’t seem to get anything to be passed. Am I missing something?
Thanks !!! you are a great teacher …..
Awesome video – short and to the point. If only more people could explain things like you do…
Anyways, I was wondering, you stated in the comments how to deal with multiple keys of an array but how would one refer to a multidimensional array? I already have code ready to push out the array but should I flatten it out or is it pretty simple? Thanks again!
Hi,
the $.post dont seems to work for me. here is my code. please tell me if i missed something, Thanks
$(function(){
$(\’#save\’).click(function(){
var items = $(\’#items\’).serialize();
$.post(\"/announcement/save\", { items: items },
function(data){
alert(data); // John
});
});
});
i got it, so it needs me to add the complete url.. good tuts.. cheers
I like this one. Very clear and easy to follow. Thanks for the tutorial
thank you …. plz keep going in this coz its helpful ::)