1

I was used to jQuery in my apps and I was doing ajax request like this:

function save_marker(Marker, mRuas, replaceWin)
{
    //Save new marker using jQuery Ajax
    var mLatLang = Marker.getPosition().toUrlValue(); //get marker position
    var myData = {ruas : mRuas, latlang : mLatLang }; //post variables
    console.log(replaceWin);        
    $.ajax({
      type: "POST",
      url: "maps/map_process.php",
      data: myData,
      success:function(data){
            replaceWin.html(data); //replace info window with new html
            Marker.setDraggable(false); //set marker to fixed
            Marker.setIcon('img/b.png'); //replace icon
        },
        error:function (xhr, ajaxOptions, thrownError){
            alert(thrownError); //throw any errors
        }
    });
}

If I take a look on my ajax request in Chrome Developer Tools under Network tab, I see that ruas and latlang were sent like Form Data. Form Data : ruas:1234 latlang:-8.459511,115.066144

Lately I am testing an ajax request like above, I do with :

var dataPath = {
        tahun          : year,
        kawasan      : areal,
        path        : pathSend,
        idGenangan  : jmlRecord
    };

    $.ajax({
        url  :'maps/modul/genangan-sql-drawing.php',
        type    :'POST',
        dataType:'json',
        data    : JSON.stringify(dataPath),
        contentType:"application/json",
        success: function(data, xhr){
            alert("Sukses Menggambar Genangan");
        },
        error:function(xhr, ajaxOptions, thrownError){
            alert(thrownError);
        }
    });

I noticed the difference how the data were sent. In this case data were sent like Request Payload.

**Request Payload**
{"tahun":"2012","kawasan":"Kawasan Genangan 2012","path":[{"lat":-8.240032737708358,"lng":115.11680603027344},{"lat":-8.331082833500302,"lng":114.98222351074219},{"lat":-8.363692651835823,"lng":115.26374816894531}],"idGenangan":1}

**Request Header**
POST /bootstrap/maps/modul/genangan-sql-drawing.php HTTP/1.1
Host: localhost
Connection: keep-alive
Content-Length: 230
Accept: application/json, text/javascript, */*; q=0.01
Origin: http://localhost
X-Requested-With: XMLHttpRequest
User-Agent: Mozilla/5.0 (Windows NT 6.3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/35.0.1916.153 Safari/537.36
Content-Type: application/json
Referer: http://localhost/bootstrap/area-genangan.php
Accept-Encoding: gzip,deflate,sdch
Accept-Language: en-US,en;q=0.8,id;q=0.6

The question is : 1. what the different between request payload and form data ? 2. why I got request payload ? 3. if I want to change request payload with form data. what should I do ?

I hope anybody understand what I mean and can help me.

R. Oosterholt
  • 7,720
  • 2
  • 53
  • 77
Arta
  • 15
  • 3
  • 8
  • 1
    You can't really send a javascript object, so jQuery serializes the data and sends it as formdata. When you send a JSON string, it's sent as a string, not formdata, so if you want to send it as formdata, stop stringifying it. – adeneo Jul 03 '14 at 05:10
  • 1
    check out these links http://stackoverflow.com/questions/10494574/what-is-the-difference-between-form-data-and-request-payload, http://stackoverflow.com/questions/23118249/whats-the-difference-between-request-payload-vs-form-data-as-seen-in-chrome, http://stackoverflow.com/questions/9597052/how-to-retrieve-request-payload – Aameer Jul 03 '14 at 05:14
  • @adeneo yes, you're right, the data sends as form data when i stop using stringify. BUT, unfortunately i found error message " SyntaxError: Unexpected token < ". have you a solution with my problem ? – Arta Jul 03 '14 at 08:23
  • You're using a dataType of JSON, and the dataType is what type of data you're expecting to get back from the server, so unless you're returning valid JSON data from the server back to the ajax request, you'll get a parse error, usually that exact error message as `<` is generally the start of HTML, not JSON. – adeneo Jul 03 '14 at 09:28
  • @adeneo : thank you so much.. finally i can resolve this problem – Arta Jul 09 '14 at 03:53

0 Answers0