Getting 500 error with CI 2.0.x, ajax and CSRF enabled

[eluser]jshultz[/eluser]
I keep getting a 500 error when submitting an ajax request. If I turn off the CSRF in config then the posting works. Once I turn it on, though, then I get the 500 error again.

In config.php I have the following values set:

Code:

$config['csrf_token_name'] = 'csrf_test_name';
    $config['csrf_cookie_name'] = 'csrf_cookie_name';

I do have jquery cookie being loaded and in my jquery file I have the following code:

Code:

$('#reorder').sortable({
        opacity: '0.5',
        update: function(e, ui){
            newOrder = $( "#reorder" ).sortable('serialize');
            csrf_cookie_name = $.cookie('csrf_cookie_name')
            console.log(newOrder);
            console.log(csrf_cookie_name);
            $.ajax({
                csrf_cookie_name: $.cookie('csrf_cookie_name'),
                url: "/client/saveOrder",
                type: "POST",
                data: newOrder,
                // complete: function(){},
                success: function(feedback){
                    console.log('success');
                    $("#feedback").html(feedback);
                    //$.jGrowl(feedback, { theme: 'success' });
                }
            });
        }
    });

console.log of csrf_cookie_name right now is: cd660b153522bef89dc53f7f95cd6b1d so I am getting the value it seems?

And finally a really simple function in client that does the data handling. Normally I would separate some of this out into the model but I was trying to keep it simple until I got it working.

Code:

function saveOrder()
     {
      $items = $this->input->post('item');
      echo '<br/>Items2:' . var_dump($items);
      $total_items = count($this->input->post('item'));
    
      for($item = 0; $item < $total_items; $item++ )
      {
    
       $data = array(
        'pageid' => $items[$item],
        'rank' => $item
       );
    
       $this->db->where('pageid', $data['pageid']);
    
       $this->db->update('pages', $data);
    
    //   echo '<br />'.$this->db->last_query();
    
      }

There's no form being used in the view. It's just an UL with a collection of LI's that I'm dragging around to sort.

[eluser]beaufrusetta[/eluser]
You have to post your csrf cookie token (csrf_test_name) in the "data" that you're POSTing to the server. In each POST request, with csrf turned on, it'll verify that the token exists (named csrf_test_name per your config), if not, it'll blow up.

In your instance, the POST name should be 'csrf_test_name' with the value of whatever is in that cookie. That should fix the issue.

[eluser]jshultz[/eluser]
So, in the data portion I should have: csrf_test_name = $.cookie('csrf_test_name') ?

IOW, it would look like this:

Code:

$.ajax({
                csrf_test_name: $.cookie('csrf_test_name'),
                url: "/client/saveOrder",
                type: "POST",
                data: newOrder,
                // complete: function(){},
                success: function(feedback){
                    console.log('success');
                    $("#feedback").html(feedback);
                    //$.jGrowl(feedback, { theme: 'success' });
                }
            });

[eluser]jshultz[/eluser]
Oh, wait, I think I know what you're saying. It should look like this:

Code:

$.ajax({
                url: "/client/saveOrder",
                type: "POST",
                data: newOrder,
                csrf_test_name: $.cookie('csrf_test_name'),
                // complete: function(){},
                success: function(feedback){
                    console.log('success');
                    $("#feedback").html(feedback);
                    //$.jGrowl(feedback, { theme: 'success' });
                }
            });

[eluser]beaufrusetta[/eluser]
It should be a POST variable - so it needs to be inside the value you have assigned to "data" - which is "newOrder".

[eluser]Matalina[/eluser]
best way to include the csrf needs is to serialize your form entire form first. It will grab all form elements and send it to the the post

Code:

newOrder = $('#form_id').serialize();

Assuming #form_id is on the id of your form. Use any identifier that is unique to the form itself.

[eluser]beaufrusetta[/eluser]
[quote author="Matalina" date="1339521452"]best way to include the csrf needs is to serialize your form entire form first. It will grab all form elements and send it to the the post

Code:

newOrder = $('#form_id').serialize();

Assuming #form_id is on the id of your form. Use any identifier that is unique to the form itself.[/quote]

Will that work with POST data sent via jQuery though? I've never used that method...seems convenient though!

[eluser]Matalina[/eluser]
it's part of the jquery api.

[eluser]beaufrusetta[/eluser]
[quote author="Matalina" date="1339521728"]it's part of the jquery api.[/quote]

I understand that it's part of the jQuery API, but the POST data inside the ajax() call is a JSON object - not a string of variables separated by ampersands.

[eluser]Matalina[/eluser]
I'm fairly confident that it can be used with in the ajax method. I be>leive I'm using it for that purpose in some place, but I'd have to go hunting the code cause I'm not exactly sure where it's at.