如何获取与数组（jQuery）具有相同名称标签的所有输入字段

Question

Is it possible to get all input-fields with the same name-tag as array and use the string in square bracket as key? Example:

<input type="hidden" name="hidden[idPub]" disabled="disabled">
<input type="hidden" name="hidden[idPri]" disabled="disabled">  
<textarea name="hidden[description]" style="height:75px;length:auto;display:block;" class="form-control" >'</textarea>

The result should be like that:

hidden => 
    "idPub" => 123,
    "idPri" => 321,
    "description" => 'test'

My actual solution:

var formData = [];
        $("input[name^='hidden[']").each(function()
        {
            formData[$(this).attr('name').replace('hidden[','').replace(']', '')] = $(this).val();
        });

Thanks in advance.

Answer 1

const formData = {};

const elements = Array.from(document.querySelectorAll("input[type=hidden]"));

elements.forEach(el => {
    const key = el.getAttribute('name');
    var matches = key.match(/\[(.*?)\]/);

  if (matches) {
    var val = matches[1];
    formData[val] = el.value;
  }
});

console.log(formData);

Answer 2

Because you're using named keys, formData should be an object , not an array.

var formData = {};
//             ^^

Additionally, your selector is only targeting <input> elements; you'll want to add a selector for <textarea> as well.

$("input[name^='hidden['],textarea[name^='hidden[']")
//                       ^^^^^^^^^^^^^^^^^^^^^^^^^^

 var formData = {}; $("input[name^='hidden['],textarea[name^='hidden[']").each(function() { formData[$(this).attr('name').replace('hidden[', '').replace(']', '')] = $(this).val(); }); console.log(formData);

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <input type="hidden" name="hidden[idPub]" value="123"> <input type="hidden" name="hidden[idPri]" value="321"> <textarea name="hidden[description]">test</textarea>

Answer 3

you can do this using regex as well.

var hidden = {};
$('input,textarea').filter(function(){
  return this.name.match(/(hidden)\[(.*?)\]/g);
}).each(function() {
  hidden[$(this).attr('name').replace('hidden[', '').replace(']', '')] = $(this).val();
});

console.log(hidden);

Check it out here: How to get all input-fields with same name-tag as array (jQuery)