Storing input data in an object with key-value pairs like so:
const object1 = {
un: inp.value,
pw: inpw.value
};
var myJSON = JSON.stringify(object1);
var myObj = JSON.parse(myJSON);
Now, I aim to store each object in an array. For example, the first input would look like:
- {"un":"john","pw":"smith"}
This would be stored in array[0].
The second input could be something similar:
- {"un":"beth","pw":"sebastian"}
And so forth..
Accessing array[0] should only display {"un":"john","pw":"smith"}'
Here is the code snippet:
<form action="" autocomplete="on">
<div class="" style="width:300px;">
<input id="myInput" type="text" name="myInput" placeholder="Input" autocomplete="input">
<input id="myPW" type="password" name="myPassword" placeholder="Password" autocomplete="password">
</div>
<input id="button" type="submit">
</form>
<h2>Username</h2>
<p id="uname"></p>
<h2>Password</h2>
<p id="pass"></p>
<h2>Data</h2>
<ol id="val"></ol>
<h2>Array</h2>
<ol id="arr"></ol>
<script>
var myButton = document.getElementById('button');
var inp = document.getElementById('myInput');
var inpw = document.getElementById('myPW');
myButton.addEventListener('click', function(event) {
event.preventDefault();
const object1 = {
un: inp.value,
pw: inpw.value
};
var myJSON = JSON.stringify(object1);
var myObj = JSON.parse(myJSON);
val.innerHTML += '<li>' + myJSON + '</li>';
// This is where we add the myJSON to the cookies array
cookies = [];
cookies.push(myJSON);
for (var i = 0; i < cookies.length; i++) {
arr.innerHTML += '<li>' + cookies[i] + '</li>';
}
});
How can I resolve this issue?