how to get data from inputs as array using Jquery?

Question

hello guys i have many input fields and i want get it as array data like this

        array (
                'gender' => "male",
                "height" => "180",
                'weight' => '90',
                'value' = '#55'
        ),
        array (
                'gender' => "male",
                "height" => "177",
                'weight' => '68',
                'value' = '#66'
        ),
        array (
                'gender' => "female",
                "height" => "150",
                'weight' => '55',
                'value' = '#77'
        ),

and this is the input fields that I want to export it into array data as I showed you

        <input type="text" gender='male' height='180' weight='90' value='#55' class='get-my-data'>
        <input type="text" gender='male' height='177' weight='68' value='#66' class='get-my-data'>
        <input type="text" gender='female' height='150' weight='55' value='#77' class='get-my-data'>

https://stackoverflow.com/questions/2276463/how-can-i-get-form-data-with-javascript-jquery — ControlAltDel, Jan 05 '23 at 21:11
Please explain what you are doing with the inputs with all those attributes. You may want to prefix them with "data-", e.g., data-height — Yogi, Jan 05 '23 at 21:20

score 1 · Accepted Answer · answered Jan 05 '23 at 21:18

If you want to actually use JQuery and not vanilla JS that is preferred, something like that should work:

const data = $('.get-my-data').map(function() {
  return {
    gender: $(this).attr('gender'),
    height: $(this).attr('height'),
    weight: $(this).attr('weight'),
    value: $(this).attr('value')
  };
}).get();

and you would get an array of objects: [{...}, {...}, ...]

how to get data from inputs as array using Jquery?

1 Answers1