Arrays in javascript with jquery

Question

I want to create an array with would hold all option element values and html text. And in a result I would like something like this:

console.log( myArray );

output:

[ "htmlText" : '0', "htmlText2" : '1', ... ]

if this is possible, how can I access them and get their keys?

or at least 2dim array

How Can I do that?

this is what I have now:

function optionValues( selectEl )
{
    var values = [];
    if ( selectEl.length )
    {
        $(selectEl).find('option').each( function(){
            values.push( $(this).val()  );
        });
        return values;
    }
    else
    return false;
}


function optionHtmls( selectEl )
{
    var html = [];
    if ( selectEl.length )
    {
        $(selectEl).find('option').each( function(){
            html.push( $(this).html()  );
        });
        return html;
    }
    else
        return false;
}

That's not an array. It sounds like what you really want is an object. — Matt Burland
– Matt Burland, Commented Aug 14, 2014 at 19:51
In PHP, arrays are associative. This is the same as objects in JavaScript. — Andrew Sula
– Andrew Sula, Commented Aug 14, 2014 at 19:53
And in Javascript, arrays are objects. Neat, huh? But a special kind of object, indeed. — MaxArt
– MaxArt, Commented Aug 14, 2014 at 19:55

dfsq · Accepted Answer · 2014-08-14 19:56:40Z

4

The function can be simplified:

function optionValues(selectEl) {
    var options = {};
    $(selectEl).find('option').each(function() {
        options[this.label] = this.value;
    });
    return options;
}

console.log(optionValues('select')) // {Text 1: "1", Text 2: "2", Text 3: "3"}

Demo: http://jsfiddle.net/c5e3vemo/

answered Aug 14, 2014 at 19:56

dfsq

193k26 gold badges244 silver badges261 bronze badges

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

Comments

Jeff N · Accepted Answer · 2014-08-14 19:51:44Z

1

Use {} instead of [] to make an associative array.

var values = {
  htmlText: 0,
  htmlText2: 1,
};

console.log(values['htmlText']);

To append things to an associative array (also referred to as an object):

values['stuff'] = 'foo';
values['thing'] = 'bar';

To loop over this:

for (var key in values) {
  /* check to make sure it's actually a valid key */
  if (values.hasOwnProperty(key)) {
    console.log(key + " => " + values[key]);
  }
}

answered Aug 14, 2014 at 19:51

Jeff N

4403 silver badges5 bronze badges

Comments

Rory McCrossan · Accepted Answer · 2014-08-14 19:53:52Z

1

An object would suit your needs best in this case. You can use map() to create one from the option elements in any given select. Try this:

var values = $('#mySelect option').map(function() {
    var obj = {};
    obj[$(this).text()] = $(this).val();
    return obj;
});

Example fiddle

Given this HTML:

<select id="mySelect">
    <option value="1">Foo</option>
    <option value="2">Bar</option>
</select>

The returned object would look like this:

[
    { "Foo": "1" },
    { "Bar": "2" }
]

answered Aug 14, 2014 at 19:53

Rory McCrossan

338k41 gold badges321 silver badges353 bronze badges

Collectives™ on Stack Overflow

Arrays in javascript with jquery

3 Answers 3

Demo: http://jsfiddle.net/c5e3vemo/

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Demo: http://jsfiddle.net/c5e3vemo/

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related