SyntaxError: Unexpected token s in JSON at position 1

Question

I'm making a plugin. I'm trying to simply update post meta in Wordpress, by posting an array/object/json array to this php code:

public static function save_settings_fields(){

    $myArray = json_decode($_POST['to_save']);
    wp_send_json(var_dump($_POST['to_save']));

    //i can't even get to this point.
    $saved_content = json_decode($_POST['to_save']);
    $post_id = $saved_content['post_id'];
    $this_count = (int)$saved_content['index'];
    $foobar = new POB_Save_Settings;
    $isdone = $foobar->update_static_content($post_id, $this_count, $saved_content);
    if ( is_wp_error( $isdone ) ) {

        wp_send_json_error( $isdone );

    } else {
      wp_send_json( $isdone );
    }
  }

my script is:

var SaveOptionSettings = function(postid, count){
    var save_array = new Array();
    save_array[0]= {};
    save_array[0]['post_id'] = postid;
    save_array[0]['content_count'] = count;
    save_array[1] = {};
    for(var i=0; i<$('#settings input').length; i++){
      save_array[1][$('#settings input').eq(i).attr('id')] = $('#settings input').eq(i).val();
    }
    for(var i=0; i<$('#settings textarea').length; i++){
      save_array[1][$('#settings textarea').eq(i).attr('id')] = $('#settings textarea').eq(i).val();
    }
    for(var i=0; i<$('#settings select').length; i++){
      save_array[1][$('#settings select').eq(i).attr('id')] = $('#settings select').eq(i).val();
    }
    console.log(save_array, JSON.stringify(save_array));
    var pva_ajax_url = pva_params.pva_ajax_url;

    $.ajax({
        type: 'POST',
        url: pva_ajax_url,
        dataType: 'json',
        data: {
            action: 'save_settings_fields',
            'to_save': JSON.stringify(save_array)
        }, success: function (result) {
          M.toast({html: 'Saved!'})
        },
        error: function(xhr,textStatus,err)
        {
            console.log("readyState: " + xhr.readyState);
            console.log("responseText: "+ xhr.responseText);
            console.log("status: " + xhr.status);
            console.log("text status: " + textStatus);
            console.log("error: " + err);
        }
    });
  }

The wp_send_json pretty much just sends me back what $_POST is getting, which apparently is:

readyState: 4
responseText: 
string(202) "[{\"post_id\":15404,\"content_count\":1},{\"label\":\"Options <span>(please select one)</span>\",\"use_conditionals\":\"on\",\"classes\":\"form-buttons\",\"style_id\":\"options\",\"subtitle\":\"test\"}]"
null
status: 200
text status: parsererror
error: SyntaxError: Unexpected token s in JSON at position 1

What I've Tried:

• using json_decode on that posted info
• adding contentType: "application/json" to the AJAX
• all combinations of removing Stringify, dataType, changing dataType to Text
• making every variable get .pushed into an array
• making the array an object, and vice versa

Am I doing something wrong?

Answer 1

your server response start with string (202) , and this is not valid json

string(202) "[{\"post_id\":15404,\"content_count\":1},{\"label\":\"Options <span>(please select one)</span>\",\"use_conditionals\":\"on\",\"classes\":\"form-buttons\",\"style_id\":\"options\",\"subtitle\":\"test\"}]"
null

and

error: SyntaxError: Unexpected token s in JSON at position 1 

this s from String

you responseText shall be something like

[{
    "post_id": 15404,
    "content_count": 1
}, {
    "label": "Options <span>(please select one)</span>",
    "use_conditionals": "on",
    "classes": "form-buttons",
    "style_id": "options",
    "subtitle": "test"
}]

// update

@lawrence-cherone php-side mention

var_dump()

wp_send_json(var_dump($_POST['to_save']));

this line need to be removed or comment

thanks for @lawrence-cherone

Also, if you'd like to debug content, you may have better success using echo or print_r.

Using one of these prints the contents of whatever you enter onto the page, which is then returned as result in the AJAX success: function(result){ ... }.