'How to map inputs inside each div to create array of hash using Javascript

I have HTML as below

<div class="link-field">
  <div class="form-group assets-form">
    <input type="text" name="description" id="description" class="assets-input" placeholder="For example, Youtube Link">
    <input type="text" name="link" id="link" class="assets-input" placeholder="For example, https://www.youtube.com/">
  </div>

  <div class="form-group assets-form">
    <input type="text" name="description" id="description" class="assets-input" placeholder="For example, Youtube Link">
    <input type="text" name="link" id="link" class="assets-input" placeholder="For example, https://www.youtube.com/">
  </div>
</div>

I have tried to iterate over each assets-form and create object like below

[
  {
    "link": "http://google.com/one",
    "description": "Link One"
  },
  {
    "link": "http://google.com/two",
    "description": "Link Two"
  }
]

using below function

$.map($('.assets-form'), function(field) {
  console.log(field)
});

Here I'm not able to construct the hash after looping over each div

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source

'How to map inputs inside each div to create array of hash using Javascript

Sources

Related Questions