CodeIgniter from Scratch Day 8: AJAX
videos

CodeIgniter from Scratch: Day 8 – AJAX

This entry is part 8 of 17 in the CodeIgniter From Scratch Session
« PreviousNext »

The CodeIgniter from Scratch series was unexpectedly, and significantly popular. Today, I’m pleased to announce that, with the help of one of my best authors, Burak, we’ll be continuing the series! Additionally, the most often requested topic is the subject for today’s screencast: combining CodeIgniter and jQuery.

Remember, it is not required that you watch the previous lessons in order to understand today’s screencast. It’s a self-contained article. However, if you’re new to CodeIgniter, we do recommend that you start from the beginning!

Catch Up

Day 8: AJAX

Other Viewing Options

Note: Want to add some source code? Type <pre><code> before it and </code></pre> after it. Find out more
  • Nicolas

    In your eclipse (Aptana) setup you run your resulting code from the browser. Is the debug button not used in eclipse for PHP development? I’m used to Android/Flex development where I hit the debug button which displays the result in a window.

    I noticed that eclipse does have the browser window for plain PHP which works however this seems useless for MVC development as the path is incorrect- Am I correct or am I not set up correctly..?

    When I do type the path correctly it works.

    …So rather than : http://localhost:8888/CI_Project/application/controllers/welcome.php?debug_host

    I type : http://localhost:8888/CI_Project/index.php/welcome?debug_host

  • vzhen

    How this work on server side if js disabled?

    i didn’t see any checking in the php file

    • TerranRich

      If JS is disabled, the form simply submits as it normally would. Since there is not “ajax” POST parameter, it displays the success page separately (the “else” block after checking for the “ajax” POST parameter in the Contact::submit() method.

  • http://www.valodustudija.lv Robert

    Very nice tutorial, but I would like to see, how we can use CI validation library to show errors. Maybe someone could help?

  • Liam

    great tutorial! This probably wasn’t implemented at the time of recording, but the current version of CodeIgniter’s Input class has a is_ajax_request() function. Eliminates the need of setting another variable yourself.

  • http://Yahoo.com Eddie

    Good tutorial,

    You can simply get all the form data by a $(“#form”).serialize() jQuery function.

  • http://Yahoo.com Eddie

    and you can simply use $this->input->is_ajax_request(); to check if the request is coming from AJAX I believe.

  • http://shoutfu.net glyn thomas

    I was looking around the internet for local (no live validation) client based AJAX validation in particular for the email address in the code example used in this excellent tut, couldn’t find any resource so I hacked this together, it may be useful for a fellow CI student looking into AJAX;

    contact form: on submit javascript click function, added code for local email validation …

    $(‘#submit’).click(function() {
    var name = $(‘#name’).val();
    var email = $(‘#email’).val();
    var message = $(‘#message’).val();
    var re = /^(([^()[\]\\.,;:\s@\”]+(\.[^()[\]\\.,;:\s@\”]+)*)|(\”.+\”))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;

    if (!name || name == ‘Name’) {
    alert(‘Please enter your name’);
    return false;
    } else if (!email || email == ‘Email’){
    alert(‘Please enter your email’);
    return false;
    } else if (!message || message == ‘Message’) {
    alert(‘Please enter your message’);
    return false;
    }

    var result = re.test(email);
    if (result == false) {
    alert(‘Please enter a valid email address’);
    return false;
    // die();
    }

    var form_data = {
    name: $(‘#name’).val(),
    email: $(‘#email’).val(),
    message: $(‘#message’).val(),
    ajax: ’1′
    };

    Please let me know if it can be improved upon, thanks for these great tuts.

  • Jonathan Pohlner

    I am getting an error Disallowed Key Characters, and finally traced it back to where I am assigning the URL,
    url: “”,

    apparently CodeIgniter does not like the greater than or less than symbols… any suggestions.

  • Ronie Apostol

    Can you help me? i logged in successfully then when i clicked logout, it will unset & destroy the session but when i clicked the back button of the browser it will show the history… do you have any idea?

  • saif

    thnx sir ..
    It was helpfull for me