How To CodeIgniter, jQuery & JSON

22

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

Share and Enjoy:
  • Digg
  • del.icio.us
  • Facebook
  • NewsVine
  • Reddit
  • StumbleUpon
  • YahooMyWeb
  • Google Bookmarks
  • Yahoo! Buzz
  • TwitThis
  • Live
  • LinkedIn
  • Pownce
  • MySpace

Comments

22 Responses to “How To CodeIgniter, jQuery & JSON”
  1. zack says:

    Could you post, or give an example on how an multiple entries in the php array would be handled in the javascript.

  2. admin says:

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

  3. Colin says:

    Ha! Did you capture this between LAX and JFK from the cockpit? Thanks for the contribution

  4. admin says:

    You can blame the juice – or me… for loving the juice,

  5. Angus says:

    Fantastic! Googled upon your bloggy goodness today (codeigniter + json) — exactly what I was looking for. Async has bedeviled, until now. Thanks mucho!

  6. Daniel says:

    Hi! Very nice post!!! Helps a lot to make things clear!!! Thanks!!!

  7. pixeam says:

    This was really helpful!! thankyou so much!

  8. GaVrA says:

    Thnx! Really good and easy to follow tut! ;)

  9. Pascal says:

    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?

  10. aster1sk says:

    Absolutely, replace “json” with “xml” and you are cooking with gas.

  11. Rocky says:

    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!

  12. aster1sk says:

    No North American proxy eh?
    No problem – just uploaded it for you here : http://is.gd/2KEEd
    Thanks for the comment!

  13. Rocky says:

    Tons of thanks :)
    You are so generous.
    By the way, could you mail me a proxy, haha :)

  14. aster1sk says:

    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/

  15. Siddhesh says:

    Thanks a lot, this post is very helpful.

  16. fnoorman says:

    Thanks man,your post really helps..

  17. Enrique says:

    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 )

  18. Constantin Iliescu says:

    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!

  19. andy says:

    how would you do this with 30 checkboxes instead of 1 textfield?

  20. aster1sk says:

    You guys asking about returning data from your model to your view – take a look at formtorch.geekhut.org

  21. Diemer says:

    Thanks man, you really helped my get a grasp on this

Speak Your Mind

Tell us what you're thinking...
and oh, if you want a pic to show with your comment, go get a gravatar!

Security Code: