CodeIgniter CSRF Protection With Ajax

A common issue I have seen lately is people using the new CSRF protection inside CodeIgniter 2.0.  This is a great new feature but it affects all post data no matter if it comes from a form or from an ajax call.  The ajax part is what seems to be tripping people up.  So I decided to write a short overview on how to accomplish sending jQuery ajax posts with CSRF enabled.

In this tutorial I will be using the jQuery cookie plugin for simplicity.

Here is the whole javascript to handle the ajax:

$("#selector").click(function () {
    e.preventDefault();
    var form_data = {
        cat_name: $('#something').val(),
        csrf_token_name: $.cookie("csrf_cookie_name")
    };

    $.ajax({
        type: "POST",
        url: SITE_URL + "controller",
        data: form_data,
        success: function(data) {
            alert('it worked');
        }
    });
});

As you can see the only thing I had to add was the following line:

csrf_token_name: $.cookie("csrf_cookie_name")

Hopefully this will help some of you folks out.