Form data into json format












-1















I have a form where I can add multiple form by clicking on plus button.In which I can add multiple rows by clicking on plus button next to row. Now I want to get this form data into json format. I give the form input name in array like



name="request[0]['testSectionHeader']"
name="request[0]['sortOrder']"


below is my form,



click here to see my form



so when I am clicking on save button it is not giving me proper result



my coming result is



{
"request[0]['testSectionHeader']":"test selection header",
"request[0]['sortOrder']":"1",
"request[0]['level2'][0]['testBlockHeader']":"asdf",
"request[0]['level2'][0]['sortOrder']":"1",
"request[0]['level2'][0]['level3'][0]['designation']":"Test Condition",
"request[0]['level2'][0]['level3'][0]['size']":"Test",
"request[0]['level2'][0]['level3'][0]['condition']":"=",
"request[0]['level2'][0]['level3'][0]['volume']":"23.6",
"request[0]['level2'][0]['level3'][0]['unit']":"C",
"request[0]['level2'][0]['level3'][0]['remark']":"U6",
"request[0]['level2'][0]['level3'][0]['interface']":"test interface1"
}


but I need like this



{
"request": [

{
"testSectionHeader": "Section Header 1",
"sortOrder": "1",
"level2": [
{
"testBlockHeader": "Section Header 1 Block1",
"sortOrder": "1",
"level3": [
{
"designation": "Software engineer",
"unit": "5",
"sortOrder": "1"
},
{
"designation": "QA Manager",
"unit": "5",
"sortOrder": "2"
}
]
}
]
},

]
}


So can you please help me how can I create it, should I need to change input name or anything need to change. this is very important for me. Thanks in advance.



My code is,



    $(document).ready(function(){
$('#dataform').on('submit', function(e){
e.preventDefault();
var data = {};
$("#dataform").serializeArray().map(function(x){
data[x.name] = x.value;
});
alert(JSON.stringify(data));

});
});


I have checked on google about my problem and try to make it like i want. but not possible you can check my below code. I don't know where is my fault.



Is there anyone who can help me ?










share|improve this question




















  • 1





    Minimal, Complete, and Verifiable example ...........

    – bambam
    Dec 31 '18 at 10:25






  • 1





    Possible duplicate of Convert form data to JavaScript object with jQuery

    – Liam
    Dec 31 '18 at 10:26











  • No, I already checked this link but i did not any solution, You can check my code.

    – Indresh Tayal
    Dec 31 '18 at 10:39











  • It's a simple case of manipulating the data. There is no magic call that's going to turn your array into a random object, your simply going to have to write the code yourself. Try it, it's really not very difficult. Here's a starting point

    – Liam
    Dec 31 '18 at 10:41













  • I tried many times but i did not get like i want. can you please help me?? what i need to change in my code??

    – Indresh Tayal
    Dec 31 '18 at 10:53
















-1















I have a form where I can add multiple form by clicking on plus button.In which I can add multiple rows by clicking on plus button next to row. Now I want to get this form data into json format. I give the form input name in array like



name="request[0]['testSectionHeader']"
name="request[0]['sortOrder']"


below is my form,



click here to see my form



so when I am clicking on save button it is not giving me proper result



my coming result is



{
"request[0]['testSectionHeader']":"test selection header",
"request[0]['sortOrder']":"1",
"request[0]['level2'][0]['testBlockHeader']":"asdf",
"request[0]['level2'][0]['sortOrder']":"1",
"request[0]['level2'][0]['level3'][0]['designation']":"Test Condition",
"request[0]['level2'][0]['level3'][0]['size']":"Test",
"request[0]['level2'][0]['level3'][0]['condition']":"=",
"request[0]['level2'][0]['level3'][0]['volume']":"23.6",
"request[0]['level2'][0]['level3'][0]['unit']":"C",
"request[0]['level2'][0]['level3'][0]['remark']":"U6",
"request[0]['level2'][0]['level3'][0]['interface']":"test interface1"
}


but I need like this



{
"request": [

{
"testSectionHeader": "Section Header 1",
"sortOrder": "1",
"level2": [
{
"testBlockHeader": "Section Header 1 Block1",
"sortOrder": "1",
"level3": [
{
"designation": "Software engineer",
"unit": "5",
"sortOrder": "1"
},
{
"designation": "QA Manager",
"unit": "5",
"sortOrder": "2"
}
]
}
]
},

]
}


So can you please help me how can I create it, should I need to change input name or anything need to change. this is very important for me. Thanks in advance.



My code is,



    $(document).ready(function(){
$('#dataform').on('submit', function(e){
e.preventDefault();
var data = {};
$("#dataform").serializeArray().map(function(x){
data[x.name] = x.value;
});
alert(JSON.stringify(data));

});
});


I have checked on google about my problem and try to make it like i want. but not possible you can check my below code. I don't know where is my fault.



Is there anyone who can help me ?










share|improve this question




















  • 1





    Minimal, Complete, and Verifiable example ...........

    – bambam
    Dec 31 '18 at 10:25






  • 1





    Possible duplicate of Convert form data to JavaScript object with jQuery

    – Liam
    Dec 31 '18 at 10:26











  • No, I already checked this link but i did not any solution, You can check my code.

    – Indresh Tayal
    Dec 31 '18 at 10:39











  • It's a simple case of manipulating the data. There is no magic call that's going to turn your array into a random object, your simply going to have to write the code yourself. Try it, it's really not very difficult. Here's a starting point

    – Liam
    Dec 31 '18 at 10:41













  • I tried many times but i did not get like i want. can you please help me?? what i need to change in my code??

    – Indresh Tayal
    Dec 31 '18 at 10:53














-1












-1








-1








I have a form where I can add multiple form by clicking on plus button.In which I can add multiple rows by clicking on plus button next to row. Now I want to get this form data into json format. I give the form input name in array like



name="request[0]['testSectionHeader']"
name="request[0]['sortOrder']"


below is my form,



click here to see my form



so when I am clicking on save button it is not giving me proper result



my coming result is



{
"request[0]['testSectionHeader']":"test selection header",
"request[0]['sortOrder']":"1",
"request[0]['level2'][0]['testBlockHeader']":"asdf",
"request[0]['level2'][0]['sortOrder']":"1",
"request[0]['level2'][0]['level3'][0]['designation']":"Test Condition",
"request[0]['level2'][0]['level3'][0]['size']":"Test",
"request[0]['level2'][0]['level3'][0]['condition']":"=",
"request[0]['level2'][0]['level3'][0]['volume']":"23.6",
"request[0]['level2'][0]['level3'][0]['unit']":"C",
"request[0]['level2'][0]['level3'][0]['remark']":"U6",
"request[0]['level2'][0]['level3'][0]['interface']":"test interface1"
}


but I need like this



{
"request": [

{
"testSectionHeader": "Section Header 1",
"sortOrder": "1",
"level2": [
{
"testBlockHeader": "Section Header 1 Block1",
"sortOrder": "1",
"level3": [
{
"designation": "Software engineer",
"unit": "5",
"sortOrder": "1"
},
{
"designation": "QA Manager",
"unit": "5",
"sortOrder": "2"
}
]
}
]
},

]
}


So can you please help me how can I create it, should I need to change input name or anything need to change. this is very important for me. Thanks in advance.



My code is,



    $(document).ready(function(){
$('#dataform').on('submit', function(e){
e.preventDefault();
var data = {};
$("#dataform").serializeArray().map(function(x){
data[x.name] = x.value;
});
alert(JSON.stringify(data));

});
});


I have checked on google about my problem and try to make it like i want. but not possible you can check my below code. I don't know where is my fault.



Is there anyone who can help me ?










share|improve this question
















I have a form where I can add multiple form by clicking on plus button.In which I can add multiple rows by clicking on plus button next to row. Now I want to get this form data into json format. I give the form input name in array like



name="request[0]['testSectionHeader']"
name="request[0]['sortOrder']"


below is my form,



click here to see my form



so when I am clicking on save button it is not giving me proper result



my coming result is



{
"request[0]['testSectionHeader']":"test selection header",
"request[0]['sortOrder']":"1",
"request[0]['level2'][0]['testBlockHeader']":"asdf",
"request[0]['level2'][0]['sortOrder']":"1",
"request[0]['level2'][0]['level3'][0]['designation']":"Test Condition",
"request[0]['level2'][0]['level3'][0]['size']":"Test",
"request[0]['level2'][0]['level3'][0]['condition']":"=",
"request[0]['level2'][0]['level3'][0]['volume']":"23.6",
"request[0]['level2'][0]['level3'][0]['unit']":"C",
"request[0]['level2'][0]['level3'][0]['remark']":"U6",
"request[0]['level2'][0]['level3'][0]['interface']":"test interface1"
}


but I need like this



{
"request": [

{
"testSectionHeader": "Section Header 1",
"sortOrder": "1",
"level2": [
{
"testBlockHeader": "Section Header 1 Block1",
"sortOrder": "1",
"level3": [
{
"designation": "Software engineer",
"unit": "5",
"sortOrder": "1"
},
{
"designation": "QA Manager",
"unit": "5",
"sortOrder": "2"
}
]
}
]
},

]
}


So can you please help me how can I create it, should I need to change input name or anything need to change. this is very important for me. Thanks in advance.



My code is,



    $(document).ready(function(){
$('#dataform').on('submit', function(e){
e.preventDefault();
var data = {};
$("#dataform").serializeArray().map(function(x){
data[x.name] = x.value;
});
alert(JSON.stringify(data));

});
});


I have checked on google about my problem and try to make it like i want. but not possible you can check my below code. I don't know where is my fault.



Is there anyone who can help me ?







javascript jquery json forms






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Dec 31 '18 at 10:38







Indresh Tayal

















asked Dec 31 '18 at 10:06









Indresh TayalIndresh Tayal

66




66








  • 1





    Minimal, Complete, and Verifiable example ...........

    – bambam
    Dec 31 '18 at 10:25






  • 1





    Possible duplicate of Convert form data to JavaScript object with jQuery

    – Liam
    Dec 31 '18 at 10:26











  • No, I already checked this link but i did not any solution, You can check my code.

    – Indresh Tayal
    Dec 31 '18 at 10:39











  • It's a simple case of manipulating the data. There is no magic call that's going to turn your array into a random object, your simply going to have to write the code yourself. Try it, it's really not very difficult. Here's a starting point

    – Liam
    Dec 31 '18 at 10:41













  • I tried many times but i did not get like i want. can you please help me?? what i need to change in my code??

    – Indresh Tayal
    Dec 31 '18 at 10:53














  • 1





    Minimal, Complete, and Verifiable example ...........

    – bambam
    Dec 31 '18 at 10:25






  • 1





    Possible duplicate of Convert form data to JavaScript object with jQuery

    – Liam
    Dec 31 '18 at 10:26











  • No, I already checked this link but i did not any solution, You can check my code.

    – Indresh Tayal
    Dec 31 '18 at 10:39











  • It's a simple case of manipulating the data. There is no magic call that's going to turn your array into a random object, your simply going to have to write the code yourself. Try it, it's really not very difficult. Here's a starting point

    – Liam
    Dec 31 '18 at 10:41













  • I tried many times but i did not get like i want. can you please help me?? what i need to change in my code??

    – Indresh Tayal
    Dec 31 '18 at 10:53








1




1





Minimal, Complete, and Verifiable example ...........

– bambam
Dec 31 '18 at 10:25





Minimal, Complete, and Verifiable example ...........

– bambam
Dec 31 '18 at 10:25




1




1





Possible duplicate of Convert form data to JavaScript object with jQuery

– Liam
Dec 31 '18 at 10:26





Possible duplicate of Convert form data to JavaScript object with jQuery

– Liam
Dec 31 '18 at 10:26













No, I already checked this link but i did not any solution, You can check my code.

– Indresh Tayal
Dec 31 '18 at 10:39





No, I already checked this link but i did not any solution, You can check my code.

– Indresh Tayal
Dec 31 '18 at 10:39













It's a simple case of manipulating the data. There is no magic call that's going to turn your array into a random object, your simply going to have to write the code yourself. Try it, it's really not very difficult. Here's a starting point

– Liam
Dec 31 '18 at 10:41







It's a simple case of manipulating the data. There is no magic call that's going to turn your array into a random object, your simply going to have to write the code yourself. Try it, it's really not very difficult. Here's a starting point

– Liam
Dec 31 '18 at 10:41















I tried many times but i did not get like i want. can you please help me?? what i need to change in my code??

– Indresh Tayal
Dec 31 '18 at 10:53





I tried many times but i did not get like i want. can you please help me?? what i need to change in my code??

– Indresh Tayal
Dec 31 '18 at 10:53












1 Answer
1






active

oldest

votes


















0














instead of using JSON.stringify() you should use for loops to create your JSON array



var _json = {}
var _requests =
var _levels =
for(var i =0;i<requests.length ;i++){
var tempRequest ;
// tempRequest = {"sortOrder": intvalue} and bla bla bla
//sortOrder
//testSectionHeader
for(var j = 0;j<levels.length;j++){
var tempLevel;
// tempLevel = {"size":"value"} and bla bla bla
//designation
//size
//condition
//volume
//unit
//remark
//interface
_levels.push(tempLevel)
}
tempRequest.levels = _levels
_requests.push(tempRequest)
}
_json = JSON.stringify(_requests) //here you got your json


this is just an example , you could change it as you want
update :



java script array length - if you have an array of request you can access to its length arrayname.length






share|improve this answer


























  • Thanks for reply. let me try like that

    – Indresh Tayal
    Dec 31 '18 at 11:42











  • Can you please explain more . like requests.length how can i get it??

    – Indresh Tayal
    Dec 31 '18 at 12:54











  • Actually i am new in jquery so that

    – Indresh Tayal
    Dec 31 '18 at 12:56











  • its pure JavaScript and i didnt use any JQuery in my code , i updated my answer its so simple you have two arrays requests and levels which you need to create a json from them and as far as i understood you need levels inside requests , you need 1 for to loop through requests and another inside that to loop through the levels and adding them into requests then make request array a json

    – Mahdi Khalili
    Jan 1 at 5:09











Your Answer






StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});


}
});














draft saved

draft discarded


















StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53986149%2fform-data-into-json-format%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown

























1 Answer
1






active

oldest

votes








1 Answer
1






active

oldest

votes









active

oldest

votes






active

oldest

votes









0














instead of using JSON.stringify() you should use for loops to create your JSON array



var _json = {}
var _requests =
var _levels =
for(var i =0;i<requests.length ;i++){
var tempRequest ;
// tempRequest = {"sortOrder": intvalue} and bla bla bla
//sortOrder
//testSectionHeader
for(var j = 0;j<levels.length;j++){
var tempLevel;
// tempLevel = {"size":"value"} and bla bla bla
//designation
//size
//condition
//volume
//unit
//remark
//interface
_levels.push(tempLevel)
}
tempRequest.levels = _levels
_requests.push(tempRequest)
}
_json = JSON.stringify(_requests) //here you got your json


this is just an example , you could change it as you want
update :



java script array length - if you have an array of request you can access to its length arrayname.length






share|improve this answer


























  • Thanks for reply. let me try like that

    – Indresh Tayal
    Dec 31 '18 at 11:42











  • Can you please explain more . like requests.length how can i get it??

    – Indresh Tayal
    Dec 31 '18 at 12:54











  • Actually i am new in jquery so that

    – Indresh Tayal
    Dec 31 '18 at 12:56











  • its pure JavaScript and i didnt use any JQuery in my code , i updated my answer its so simple you have two arrays requests and levels which you need to create a json from them and as far as i understood you need levels inside requests , you need 1 for to loop through requests and another inside that to loop through the levels and adding them into requests then make request array a json

    – Mahdi Khalili
    Jan 1 at 5:09
















0














instead of using JSON.stringify() you should use for loops to create your JSON array



var _json = {}
var _requests =
var _levels =
for(var i =0;i<requests.length ;i++){
var tempRequest ;
// tempRequest = {"sortOrder": intvalue} and bla bla bla
//sortOrder
//testSectionHeader
for(var j = 0;j<levels.length;j++){
var tempLevel;
// tempLevel = {"size":"value"} and bla bla bla
//designation
//size
//condition
//volume
//unit
//remark
//interface
_levels.push(tempLevel)
}
tempRequest.levels = _levels
_requests.push(tempRequest)
}
_json = JSON.stringify(_requests) //here you got your json


this is just an example , you could change it as you want
update :



java script array length - if you have an array of request you can access to its length arrayname.length






share|improve this answer


























  • Thanks for reply. let me try like that

    – Indresh Tayal
    Dec 31 '18 at 11:42











  • Can you please explain more . like requests.length how can i get it??

    – Indresh Tayal
    Dec 31 '18 at 12:54











  • Actually i am new in jquery so that

    – Indresh Tayal
    Dec 31 '18 at 12:56











  • its pure JavaScript and i didnt use any JQuery in my code , i updated my answer its so simple you have two arrays requests and levels which you need to create a json from them and as far as i understood you need levels inside requests , you need 1 for to loop through requests and another inside that to loop through the levels and adding them into requests then make request array a json

    – Mahdi Khalili
    Jan 1 at 5:09














0












0








0







instead of using JSON.stringify() you should use for loops to create your JSON array



var _json = {}
var _requests =
var _levels =
for(var i =0;i<requests.length ;i++){
var tempRequest ;
// tempRequest = {"sortOrder": intvalue} and bla bla bla
//sortOrder
//testSectionHeader
for(var j = 0;j<levels.length;j++){
var tempLevel;
// tempLevel = {"size":"value"} and bla bla bla
//designation
//size
//condition
//volume
//unit
//remark
//interface
_levels.push(tempLevel)
}
tempRequest.levels = _levels
_requests.push(tempRequest)
}
_json = JSON.stringify(_requests) //here you got your json


this is just an example , you could change it as you want
update :



java script array length - if you have an array of request you can access to its length arrayname.length






share|improve this answer















instead of using JSON.stringify() you should use for loops to create your JSON array



var _json = {}
var _requests =
var _levels =
for(var i =0;i<requests.length ;i++){
var tempRequest ;
// tempRequest = {"sortOrder": intvalue} and bla bla bla
//sortOrder
//testSectionHeader
for(var j = 0;j<levels.length;j++){
var tempLevel;
// tempLevel = {"size":"value"} and bla bla bla
//designation
//size
//condition
//volume
//unit
//remark
//interface
_levels.push(tempLevel)
}
tempRequest.levels = _levels
_requests.push(tempRequest)
}
_json = JSON.stringify(_requests) //here you got your json


this is just an example , you could change it as you want
update :



java script array length - if you have an array of request you can access to its length arrayname.length







share|improve this answer














share|improve this answer



share|improve this answer








edited Jan 2 at 10:51

























answered Dec 31 '18 at 11:14









Mahdi KhaliliMahdi Khalili

11411




11411













  • Thanks for reply. let me try like that

    – Indresh Tayal
    Dec 31 '18 at 11:42











  • Can you please explain more . like requests.length how can i get it??

    – Indresh Tayal
    Dec 31 '18 at 12:54











  • Actually i am new in jquery so that

    – Indresh Tayal
    Dec 31 '18 at 12:56











  • its pure JavaScript and i didnt use any JQuery in my code , i updated my answer its so simple you have two arrays requests and levels which you need to create a json from them and as far as i understood you need levels inside requests , you need 1 for to loop through requests and another inside that to loop through the levels and adding them into requests then make request array a json

    – Mahdi Khalili
    Jan 1 at 5:09



















  • Thanks for reply. let me try like that

    – Indresh Tayal
    Dec 31 '18 at 11:42











  • Can you please explain more . like requests.length how can i get it??

    – Indresh Tayal
    Dec 31 '18 at 12:54











  • Actually i am new in jquery so that

    – Indresh Tayal
    Dec 31 '18 at 12:56











  • its pure JavaScript and i didnt use any JQuery in my code , i updated my answer its so simple you have two arrays requests and levels which you need to create a json from them and as far as i understood you need levels inside requests , you need 1 for to loop through requests and another inside that to loop through the levels and adding them into requests then make request array a json

    – Mahdi Khalili
    Jan 1 at 5:09

















Thanks for reply. let me try like that

– Indresh Tayal
Dec 31 '18 at 11:42





Thanks for reply. let me try like that

– Indresh Tayal
Dec 31 '18 at 11:42













Can you please explain more . like requests.length how can i get it??

– Indresh Tayal
Dec 31 '18 at 12:54





Can you please explain more . like requests.length how can i get it??

– Indresh Tayal
Dec 31 '18 at 12:54













Actually i am new in jquery so that

– Indresh Tayal
Dec 31 '18 at 12:56





Actually i am new in jquery so that

– Indresh Tayal
Dec 31 '18 at 12:56













its pure JavaScript and i didnt use any JQuery in my code , i updated my answer its so simple you have two arrays requests and levels which you need to create a json from them and as far as i understood you need levels inside requests , you need 1 for to loop through requests and another inside that to loop through the levels and adding them into requests then make request array a json

– Mahdi Khalili
Jan 1 at 5:09





its pure JavaScript and i didnt use any JQuery in my code , i updated my answer its so simple you have two arrays requests and levels which you need to create a json from them and as far as i understood you need levels inside requests , you need 1 for to loop through requests and another inside that to loop through the levels and adding them into requests then make request array a json

– Mahdi Khalili
Jan 1 at 5:09




















draft saved

draft discarded




















































Thanks for contributing an answer to Stack Overflow!


  • Please be sure to answer the question. Provide details and share your research!

But avoid



  • Asking for help, clarification, or responding to other answers.

  • Making statements based on opinion; back them up with references or personal experience.


To learn more, see our tips on writing great answers.




draft saved


draft discarded














StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53986149%2fform-data-into-json-format%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown





















































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown

































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown







Popular posts from this blog

The term 'EXEC' is not recognized as the name of a cmdlet Powershell

NPM command prompt closes immediately [closed]

Error binding properties and functions in emscripten