Jquery get values from dynamically generated input texts

Question

Jquery get values from dynamically generated input texts

This is an example of what I am trying to achieve. Let me put the html code and describe afterwards

<div class="col-xs-3 ">
                    <label for="pointMap[0]-value">firstkey</label>
                    <input type="text" id="pointMap[0]-value" name="pointsValueMap[firstkey]" value="value1">
                </div>
            
                <div class="col-xs-3 ">
                    <label for="pointMap[1]-value">secondkey</label>
                    <input type="text" id="pointMap[1]-value" name="pointsValueMap[secondkey]" value="value2">
                </div>

I would like to have all the values of however many of these kinds of input type text id (pointMap[i]-value). Please also suggest if there is a better way than having them an array when collected. My mind is blank on what should I be looping against, in a for loop, I am unable to find a terminating condition (size of these input texts).

Give them a common className and loop through that class

charlietfl
– charlietfl

2020-07-25 13:39:25 +00:00
Commented Jul 25, 2020 at 13:39 — charlietfl
– charlietfl, Commented Jul 25, 2020 at 13:39
I will try it, thanks @charlietfl

Eshan I.
– Eshan I.

2020-07-25 13:47:22 +00:00
Commented Jul 25, 2020 at 13:47 — Eshan I.
– Eshan I., Commented Jul 25, 2020 at 13:47

AKT · Accepted Answer · 2020-07-25 13:44:15Z

2

Since you are using jQuery. You can use the attribute contains selector. There is whole list of such selectors in jQuery.

You can store values of such inputs in an array like this

var inputStore = []; //Where you want to store the values

$("input[name*=pointsValueMap]").each(function(){ //Will check for inputs with name containing pointsValueMap
  inputStore.push($(this).val())
});

answered Jul 25, 2020 at 13:44

AKT

1,0818 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Eshan I. Over a year ago

What strategy would I use to have an associated array with the key as well? (See the keys that gets printed at top first key and second key? Thanks

AKT Over a year ago

Add some data attribute to the input box, <input type="text" data-key="firstkey" .. Then inside the jquery each function you can access it with $(this).data('key') and use it however you like.

Collectives™ on Stack Overflow

Jquery get values from dynamically generated input texts

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related