Send data with native javascript ajax

Question

I'm using native javascript ajax but when I look at what's posted it simply says [object Object] and so trying to capture $_REQUEST['stringSent'] in the php file does nothing

Here's what I'm trying, called using dataPost('test')

function dataPost(dataToSend) {
  var params = { "stringSent": dataToSend };
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.onreadystatechange = function () {
    if (xmlhttp.readyState == 4 && xmlhttp.status === 200) {
      if (typeof success === "function") {
        alert(xmlhttp.responseText);
        success(xmlhttp.responseText);
      }
    }else if(typeof error === "function" && (xmlhttp.status > 299 || xmlhttp.status < 200)){
      error();    
    }
  }
  xmlhttp.open("POST", 'dataCapture.php', true);
  xmlhttp.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');
  //xmlhttp.send(JSON.stringify(data)); // not needed as I'm sending JSON anyway
  xmlhttp.send(params);
}

Is there a better way to do this?

Answer 1

Comment this line :

// xmlhttp.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');

or Change it to :

xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send('stringSent=' + dataToSend);

Answer 2

Use Jquery Ajax.

$.ajax({
url: 'dataCapture.php',
dataType: 'text',
type: 'post',
contentType: 'application/x-www-form-urlencoded',
data: params ,
success: function( data, textStatus, jQxhr ){ $('#response pre').html( data    ); },
error: function( jqXhr, textStatus, errorThrown ){ console.log( errorThrown ); }
});