How to Add Text Inputs val() Into JSON Array

Question

Can you please take a look at This Demo and let me how I can Add/ Insert the data into the JSON array Users?

"users":[
    {"user":"John", "age":36, "grade":"C", "mark":88 }, 
    {"user":"Rose", "age":28, "grade":"B", "mark":90 }, 
    ....
]

$(document).ready(function () {
    $("#addtoJSON").click(function () {
        var user = $("#user").val();
        var age = $("#age").val();
        var grade = $("#grade").val();
        var mark = $("#mark").val();
        // alert(user);
        var data = 'name=' + user + '&age=' + age + '&grade=' + grade + '&mark=' + mark;
        alert(data);
    });
});

Thanks

Amit Joki · Accepted Answer · 2014-09-30 05:59:33Z

2

Use this code:

var dataArr = [];
var data = JSON.stringify({  // use JSON.stringify to convert object to JSON
    name: user,
    age: age,
    grade: grade,
    mark: +mark
});
dataArr.push(data);
alert(data); // well formed JSON

DEMO

edited Sep 30, 2014 at 5:59

answered Sep 30, 2014 at 5:46

Amit Joki

59.4k7 gold badges80 silver badges96 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Mona Coder Over a year ago

Hi Amit, Thanks for reply but how I can add each new series of input into the data?

Mona Coder Over a year ago

I mean I need to create Array of JSON object

Regent · Accepted Answer · 2014-09-30 05:59:16Z

You can simply add new Object to "users" Object's array:

Fiddle.

var fullData =
{
    "users":
    [
        {
            "user": "John",
            "age": 36,
            "grade": "C",
            "mark": 88
        }, 
        {
            "user": "Rose",
            "age": 28,
            "grade": "B",
            "mark": 90
        }
    ]
};

$(document).ready(function()
{
    $("#addtoJSON").click(function()
    {
        var user = $("#user").val();
        var age = parseInt($("#age").val());
        var grade = $("#grade").val();
        var mark = parseInt($("#mark").val());
        var data = 
        {
            name: user,
            age: age,
            grade: grade,
            mark: mark
        };
        fullData.users.push(data);
        console.log(fullData);
        console.log(JSON.stringify(fullData));
    });
});

triju · Accepted Answer · 2014-09-30 06:07:24Z

0

This will help -:

$(document).ready(function () {
  var jsonArg1 = new Object();
  var jsonArg2 = new Object();
   $("#addtoJSON").click(function () {
     jsonArg1.user = $("#user").val();
     jsonArg1.age = $("#age").val();
     jsonArg1.grade = $("#grade").val();
     jsonArg1.mark = $("#mark").val();

     jsonArg12.users = jsonArg1;

     var pluginArrayArg = new Array();
     pluginArrayArg.push(jsonArg12);
     pluginArray = (JSON.stringify(pluginArrayArg))
     console.log(pluginArray);
  });
});

answered Sep 30, 2014 at 6:07

triju

293 bronze badges

Collectives™ on Stack Overflow

How to Add Text Inputs val() Into JSON Array

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related