Creating a JSON dynamically with each input value using jquery

Question

I got a situation where I would like to read some data off a JSON format through PHP, however I am having some issues understanding how I should construct the Javascript object to create the JSON format dynamically.

My scenario is as follows:

<input title="QA" type="text" class="email"> <input title="PROD" type="text" class="email"> <input title="DEV" type="text" class="email"> 

The Javascript code I have so far goes through each input grabs the data, I am however unable to understand how to process from here on.

var taskArray = {};  $("input[class=email]").each(function() {   var id = $(this).attr("title");   var email = $(this).val();    //how to create JSON?  }); 

I would like to get the following output if possible.

[{title: QA, email: '[email protected]'}, {title: PROD, email: '[email protected]'},{title: DEV, email: '[email protected]'}] 

Where the email is acquired by the input field value.

Answer 1

Like this:

function createJSON() {     jsonObj = [];     $("input[class=email]").each(function() {          var id = $(this).attr("title");         var email = $(this).val();          item = {}         item ["title"] = id;         item ["email"] = email;          jsonObj.push(item);     });      console.log(jsonObj); } 

Explanation

You are looking for an array of objects. So, you create a blank array. Create an object for each input by using 'title' and 'email' as keys. Then you add each of the objects to the array.

If you need a string, then do

jsonString = JSON.stringify(jsonObj); 

Sample Output

[{"title":"QA","email":"a@b"},{"title":"PROD","email":"b@c"},{"title":"DEV","email":"c@d"}]