I am building a function which posts data using Ajax to my Codeigniter controller. The problem is as follows.

Codeigniter requires individual post data (no object) to allow me to fully validate the data. Otherwise, I need to use the validation rules as discrete methods, and some rules, like xss_clean, are not available as discrete methods (see CI docs). I therefore need to send the data in Ajax like this.

data: {
    username: username,
    password: password
},

I now have an array passed to the post function.

{'username': $("#username").val(), 'password': $("#password").val()};

I need to rebuild this array to the Ajax data way above. I tried for loops and the .each() function in the Ajax POST function, but this is not working.

Anyone any ideas on how to fix this and allow me to pass an array to the post function, but also allow me to separate this data in order to validate it with Codeigniter.

I am building a function which posts data using Ajax to my Codeigniter controller. The problem is as follows.

Codeigniter requires individual post data (no object) to allow me to fully validate the data. Otherwise, I need to use the validation rules as discrete methods, and some rules, like xss_clean, are not available as discrete methods (see CI docs). I therefore need to send the data in Ajax like this.

data: {
    username: username,
    password: password
},

I now have an array passed to the post function.

{'username': $("#username").val(), 'password': $("#password").val()};

I need to rebuild this array to the Ajax data way above. I tried for loops and the .each() function in the Ajax POST function, but this is not working.

Anyone any ideas on how to fix this and allow me to pass an array to the post function, but also allow me to separate this data in order to validate it with Codeigniter.

• javascript
• php
• jquery
• ajax
• codeigniter

3 Answers 3

To post the data with the help of Ajax, simplete use JSON.stringify() method. As below

 data : JSON.stringify({username: $("#username").val(), password: $("#password").val()})

It will turns a Javascript object into JSON text and stores that JSON text in a string

I managed to solve the problem using this question on Stackoverflow. Codeigniter needs POST data to properly validate the data. To validate each piece of data, the data needs to be separated. This is what I tried to achieve with my Ajax POST function. The Ajax POST function posts an array of all the form data, which is not separated. With this array, I was unable to validate the data using the Codeigniter rules.

The solution to this problem is not to try separating this data when posted by Ajax, but when the back-end obtains this POST data. The POST data is obtained as an object by the back-end. By looping this POST data in PHP, new POST indices can be declared, as if they were posted directly by the form itself. This sounds a little cryptic, here's the code which may clarify it:

login.php(view) - The page containing the form, which posts the data to a function called 'postajax'. This is function containing a basic Ajax post request.

$(document).ready(function(){ 
    $("#submit").click(function(){
        postvalues = {username: $("#username").val(), password: $("#password").val()};
        postajax('Login', postvalues);
        return false;
    });
});

Login.php(controller) - The controller handeling the POST data. To validate the data in this file, the POST data needs to be separated.

foreach($_POST['data'] as $key => $value){
    $_POST[$key] = $value;
}

Now the POST data is separated how Codeigniter expects it, and normal validation can be used for the data. For example, if the data array contained a key-value pair username => 'Testuser', it can be validated like a normal form.

$this->form_validation->set_rules('username', 'Username', 'required');

Thanks a lot for the help!

Here's my post.js file with the POST function.

function postajax(page, postvalues){
    $("#result").empty();
    $.ajax({
        type: "POST",
        url: page, 
        data: {
            data: postvalues
        },
        dataType: "text",  
        cache:false,
        beforeSend: function(){
            $("#loading").css({ visibility: "visible"});
        },
        success: 
        function(data){
            $("#loading").css({ visibility: "hidden"});
            $('#result').html(data);
        }
    });
 }

I think you have what you need in

{'username': $("#username").val(), 'password': $("#password").val()};

which I assume would be the value for the data: option of the AJAX call.

That object will appear at the server in the $_POST array. For example, if the input values are 'A Name' and 'thisisthepassword' then var_dump($_POST); will produce

array (size=2)
  'username' => string 'A Name' (length=6)
  'password' => string 'thisisthepassword' (length=17)

Using CI methods you would access the posted data like this

$username = $this->input->post('username');
$password = $this->input->post('password');

JQuery does all the work of converting the object to the proper data structure for posting to the server.