AJAX JSON array to single JSON object - html

Question

I'm using AJAX to send JSON data from a form to my server, however it's sending it as an array of JSON values, rather than just a single JSON object - how can I modify this script to send it as a single object?
function send() {
$.ajax({
method: "POST",
url: "http://localhost:1323/submitted",
contentType: "application/json",
dataType: "json",
data: JSON.stringify($("#myform").serializeArray())
});
}
For example, instead of sending it as:
[{"name":"name","value":"boris"},{"name":"password","value":"password123"}]
I'd like to send it as:
{"name":"boris", "password":"password123"}

Answer 1

You can use .each loop to iterate through all inputs and push name and value inside JSON Object.
Demo code:
function send() {
var json_object = {};
//loop through inputs
$("#myform input").each(function(i, v) {
json_object[$(this).attr("name")] = $(this).val() //get values
})
console.log(json_object)
//or
var json_object1 = {}
$($("#myform").serializeArray()).each(function(i, v) {
json_object1[v.name] = v.value
})
console.log(json_object1)
//send this..
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="myform">
<input name="name" type="text">
<input name="password" type="text">
<button type="button" onclick="send()">Send</button>
</form>