Setting variable names in jQuery from a variable

Question

I'm using multiple select boxes on my website and use the id from each of these to select the :selected val and set it as a variable. You will see the 3 randomly chosen below and I'm stuck on adding the word val into the new way of setting multiple variables.

before

var maptypecontrolval       = $('#maptypecontrol>option:selected').val();
var pancontrolval       = $('#pancontrol>option:selected').val();
var clickzoomcontrolval     = $('#clickzoomcontrol>option:selected').val();

after

$(".settings select").each(function(){
    var id = $(this).attr('id');
    console.log(id);
});

What is your goal? You store the values of select boxes and then what? — Artyom Neustroev
– Artyom Neustroev, Commented Nov 10, 2013 at 17:46
It's not very clear what you want to do, but with a high probability you need a single object instead of many separate variables. — JJJ
– JJJ, Commented Nov 10, 2013 at 17:46
@ArtyomNeustroev the goal is to cut down the multiple lines of before and cut it down into an .each() function that will write it and I am unable to add val to the end of the id variable to declare. — ngplayground
– ngplayground, Commented Nov 10, 2013 at 17:47

Daniel Gimenez · Accepted Answer · 2013-11-10 17:52:01Z

1

Instead of having each option as an individual variable, I would create an object to store all of your variable values.

var appOptions = { };

$(".settings select").each(function() {
  var id = $(this).prop('id');
  appOptions[id] = $(this).val();
});

This approach has the risk of becoming unpredictable if you forget to put an id on a select element in the selector, so you might want to add some validation:

if (!id) throw 'select without id';

As an aside: you got the id value from attr() in your code. You're supposed to use prop(). http://api.jquery.com/prop/

edited Nov 10, 2013 at 17:52

answered Nov 10, 2013 at 17:46

Daniel Gimenez

21.1k4 gold badges60 silver badges78 bronze badges

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

2 Comments

ngplayground Over a year ago

in my before example the id name has the letters 'val' after it. how can this be introduced?

Daniel Gimenez Over a year ago

appOptions[id + 'val']

codingrose · Accepted Answer · 2013-11-10 17:46:51Z

1

You can use array and object.

Try this:

var ary = [];
$(".settings select").each(function(){
    var obj = {};
    obj.id = $(this).attr('id');
    obj.val = $(this).find('option:selected').val();
    ary.push(obj);
});
console.log(ary);

ary will contain objects containing ids and values.

answered Nov 10, 2013 at 17:46

codingrose

15.7k11 gold badges41 silver badges58 bronze badges

3 Comments

JJJ Over a year ago

What's the point of the array? Why not just use the ids as object keys?

codingrose Over a year ago

I think @beardy wants id and value of select box

JJJ Over a year ago

Yes, and you can store the id in the keys just as well. If you have an array with separate objects it'll be a pain to find anything from there.

Collectives™ on Stack Overflow

Setting variable names in jQuery from a variable

2 Answers 2

2 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related