2

My JSON string looks like this:

{  
   "main_object":{  
      "id":"new",
      "formData":"language=nl_NL&getExerciseTitle=3213&question_takeAudio_exerciseWord%5B0%5D=3213&Syllablescounter%5B0%5D=3213S&Syllablescounter%5B1%5D=321"
   }
}

As you can see I have language=nl_NL, but I am looking to have it like this -> "language": "nl_NL and so on, instead of the & in between.

This is most likely what is causing the long string ->

function saveExerciseAjaxCall() {
    $("#my_form").on("submit", function(event) {
        event.preventDefault();
        $.ajax({
            url: 'saveJson.php',
            type: 'POST',
            data: {
                id: getUrlParameter('id'),
                formData: $('#my_form').serialize()
            },
            dataType: 'json',
        }).done(function(response) {

        });
    });
}

The part where it is being serialize(), but to be honest: I have no idea what to do to change this, I read something about serializeArray() but that will display it in my JSON file like this -> "name": "exampleForStackOverflow": "value": "TheValueGiven" something that looks like this. So does anyone have a solution on how to change my AJAX so it won't end up being one long string? But for it to be like "language": "nl_NL" etc.?

Zoe
  • 27,060
  • 21
  • 118
  • 148
D.Sof
  • 119
  • 1
  • 10
  • take a look at https://stackoverflow.com/a/11338832/4437464 – Elyas Esna Jun 08 '18 at 10:36
  • I took a look and @STEEL had a good solution (it seems), but I am wondering: What does the .datahere means in his code? which data is he refering to? – D.Sof Jun 08 '18 at 11:03

1 Answers1

0

You can convert your urlParameter format to Object like this :

var obj = {
  "id": "new",
  "formData": "language=nl_NL&getExerciseTitle=3213&question_takeAudio_exerciseWord%5B0%5D=3213&Syllablescounter%5B0%5D=3213S&Syllablescounter%5B1%5D=321"
};

obj.formData = JSON.parse('{"' + decodeURI(obj.formData).replace(/"/g, '\\"').replace(/&/g, '","').replace(/=/g, '":"') + '"}');

console.log(obj.formData);

In your code :

function saveExerciseAjaxCall() {
    $("#my_form").on("submit", function(event) {
        event.preventDefault();
        $.ajax({
            url: 'saveJson.php',
            type: 'POST',
            data: {
                id: getUrlParameter('id'),
                formData: JSON.parse('{"' + decodeURI($('#my_form').serialize()).replace(/"/g, '\\"').replace(/&/g, '","').replace(/=/g, '":"') + '"}')
            },
            dataType: 'json',
        }).done(function(response) {

        });
    });
}

Other solution :

function saveExerciseAjaxCall() {
    $("#my_form").on("submit", function(event) {
        event.preventDefault();
        $.ajax({
            url: 'saveJson.php',
            type: 'POST',
            data: $('#my_form').serialize() + "&id=" + getUrlParameter('id'),
        }).done(function(response) {

        });
    });
}
user2226755
  • 12,494
  • 5
  • 50
  • 73
  • and where should I implement this piece of code if u don't mind me asking? and you have var obj = and then the direct string, but what if the var obj has to remain a variable (because the data is changing constantly with everything being inserted and sent) – D.Sof Jun 08 '18 at 11:05
  • THANK YOU SO MUCH, THANK YOU SO MUCH. ONE WEEK OF SUFFERING AND IT FINALLY WORKS. GOD BLESS YOUR HANDS. – D.Sof Jun 08 '18 at 11:09
  • @D.Sof Also, you can try : `data : $('#form').serialize() + "&id=" + getUrlParameter('id')`, it's maybe more efficient. – user2226755 Jun 08 '18 at 11:15
  • how is it more sufficient? – D.Sof Jun 08 '18 at 12:29
  • There is less operation – user2226755 Jun 08 '18 at 12:31