JQuery Ajax Tagit Array to PHP returning [object Object]

I’ve tried to implement Tagit to my website, but I can’t get the array of tags to behave in a way I want it to…

I’ve googled and tried a bunch of different things but cant get it to work.

This is my JavaScript function:

function saveSkillTags( tags ) {
$.ajax({
  type: "POST",
  dataType: "json",
traditional: true,
  url: "/../includes/ajaxController.php",
  data: {actionCommand : "SAVE_SKILL_TAGS", tags : tags }
}).done(function( res ) {
    console.debug('klar');
});
}

Console.debug showed me that the “tags” array looks like this:

[Object { label="php",  value="php",  element=[1],  mer...}, Object { label="ajax",  value="ajax",  element=[1],  mer...}, Object { label="javascript",  value="javascript",  element=[1],  mer...}, Object { label="jquery",  value="jquery",  element=[1],  mer...}]

It posts to my ajaxController which has this code:

if( $actionCommand == 'SAVE_SKILL_TAGS' ) {
require_once( dirname( __FILE__ ).'/../classes/stuff.class.php' );
$list = new UserStuff();
$list->saveSkillTags( $utility->getUserId(), $_POST['tags'] );
}

So, so far so good…

Then in stuff.class.php I have the function “saveSkillTags”. Here is the problem… I’ve tried to encode and decode json, and tried it just without json, but I can’t get anything to work… Here is the function:

function saveSkillTags( $userId, $tags ) {
    $dbCon = new DBConnection();
    //$tags = json_decode($tags);
    error_log($tags);
    foreach ( $tags as $tag => $value ) {
        $skillTag = $dbCon->escape( $value );
        $query = "INSERT INTO skilltag SET ";
        $query .= "User_fk=".$userId;
        $query .= ", TagName='".$skillTag."'";
        $dbCon->execute( $query );
        error_log($query);
    }
    
    mysql_close();
    echo 'true';
}

As you see, I error_log $tags.

And when I run this setup I get two errors. The first one is the $tags var, and the second one is generated.

[24-Aug-2012 22:28:35] [object Object]

[24-Aug-2012 22:28:35] PHP Warning:  Invalid argument supplied for foreach() in C:Users...classesstuff.class.php on line 103

I’ve fiddled with this now for several hours and starting to doubt my programming skills heavily…

Please help me get back on track, even a hint would be much appreciated!

Answer

What you need to do is pass the data inside tags as JSON – currently it is being posted a object. In order to do this use JSON.stringify()

$.ajax({
  type: "POST",
  dataType: "json",
traditional: true,
  url: "test.php",
  data: {actionCommand : "SAVE_SKILL_TAGS", tags : JSON.stringify(tags) }
}).done(function( res ) {
    alert(res);
});
});

JSON.stringify is available in most modern browsers (but maybe not in some older ones). Basically it takes a Javascript object and converts it into a JSON string. Note that when stringifying, it might escape quotes and stuff, to ensure that the resultant JSON is valid.

So in the PHP script, if you do a print_r($_POST['tags']), you should see how the JSON looks and then you can adjust your code accordingly.

UPDATE

Try the following foreach loop:

foreach ( $tags as $tag => $value ) 
{ 
    $skillTag = $value->value; 
    $query = "INSERT INTO skilltag (User_fk, TagName) values ('".$userId."','".$skillTag."')"; 
    $dbCon->execute( $query ); 
}