2

I'm having trouble with array in javascript. Is it possible to insert name and value in the same array

here is my code for array

press=new Array('T shirt black - $23','Sweater black - $34','Hoodie shirt black - $87');

and here is what I want to be the output 

<option value="23">T shirt black - $23</option>

how can I put the "23" in the array?

Here is the full code. Sorry if I can't explain it

http://jsfiddle.net/V64hb/1/

http://pastebin.com/zyiQGHTS

blademaster
  • 101
  • 1
  • 5
  • 11
  • Check this link http://stackoverflow.com/questions/170986/what-is-the-best-way-to-add-options-to-a-select-from-an-array-with-jquery?rq=1 – Ahamed Mustafa M Dec 29 '13 at 10:43

4 Answers4

1

You can use an array of objects:

press = [
    { desc: 'T shirt black',
      price: 23
    },
    { desc: 'Sweater black'
      price: 34
    },
    { desc: 'Hoodie shirt black'
      price: 87
    }
];

You can then access them with press[i].desc and press[i].price.

press.forEach(function(item) {
    $('#item').append($('<option/>', {
        value: item.price,
        text: item.desc+' - $'+item.price
    }));
});

Here's the full rewrite of your fiddle. I also got rid of eval(), by putting all the different arrays into an object keyed off the category value.

$(document).ready(function () {
    dropdowns = {
        web: [
            {desc: "1 Custom Web Page", price: 39},
            {desc: "5 Custom Web Pages", price: 190},
            {desc: "10 Custom Web Pages", price: 375},
            {desc: "20 Custom Web Pages", price: 710}
        ],
        art: [{desc: '300-word Article x 1', price: 7.00},
              {desc: '300-word Article x 5', price: 32.00},
              {desc: '400-word Article x 1', price: 8.00},
              {desc: '400-word Article x 5', price: 37.00},
              {desc: '500-word Article x 1', price: 9.00},
              {desc: '500-word Article x 5', price: 40.00},
              {desc: '700-word Article x 1', price: 12.00},
              {desc: '700-word Article x 5', price: 57.00},
              {desc: '1000-word Article x 1', price: 15.00},
              {desc: '1000-word Article x 5', price: 70.00}],
        blog: [{desc: '300-word Custom Blog x 1', price: 10},
               {desc: '400-word Custom Blog x 1', price: 12},
               {desc: '500-word Custom Blog x 1', price: 14},
               {desc: '300-word Custom Blog x 5', price: 47},
               {desc: '400-word Custom Blog x 5', price: 55},
               {desc: '500-word Custom Blog x 5', price: 63}
              ],
        press: [{desc: '300-word Custom Press Release', price: 27},
                {desc: '400-word Custom Press Release', price: 37},
                {desc: '500-word Custom Press Release', price: 47}
               ]
    }

    populateSelect();

    $(function () {
        $('#cat').change(populateSelect);
    });

    function populateSelect() {
        var cat = $('#cat').val();
        $('#item').empty();

        dropdowns[cat].forEach(function(item) {
            $('#item').append($('<option/>', {
                value: item.price,
                text: item.desc+' = $'+item.price
            }));
        });
    }

});

DEMO

Barmar
  • 741,623
  • 53
  • 500
  • 612
  • Sir if I use that how can I display it? I have function populate select. it will populate the 2nd dropdownlist please kindly see my full code I'm not good in javascript. – blademaster Dec 29 '13 at 11:05
  • thank you sir gonna try it now please stay with me for a minute haha I really need help thank you – blademaster Dec 29 '13 at 11:16
  • Sir I don't get it I don't know how to insert it at my function Populateselect At line 19 http://jsfiddle.net/V64hb/1/ – blademaster Dec 29 '13 at 11:20
0

The simplest way is for me, spliteach entry uing entry.split('-')[1];. After that the entry will be $23. Trim it (using entry.trim(), and get the substring from the second character. This will remove the $.

Vinz243
  • 9,654
  • 10
  • 42
  • 86
  • Sir kindly check my code please. In line 50 I want the option to become I was wonderin how can put the 23 in the value with the array – blademaster Dec 29 '13 at 10:57
0

You could potentially use an array of objects (PHP uses associative arrays for this; these are also referred to as hash maps, and by many other names in many other different languages):

Here's the jsfiddle:

var clothing = [

    {
         type: 't-shirt',
         color: 'black',
         price: 23
    },

    {
         type: 'sweater',
         color: 'black',
         price: 34
    }

]

var i, len = clothing.length;

for (i=0; i<len; i++) {
    var obj = clothing[i];

    console.log('object at index ' + i + ' of clothing array - ');

    for (key in obj) {
        console.log(key + ':' + obj[key]);
    }
}

OUTPUT:

object at index 0 of clothing array -
type:t-shirt
color:black
price:23

object at index 1 of clothing array -
type:sweater
color:black
price:34
Josh Beam
  • 19,292
  • 3
  • 45
  • 68
0

you can use split function if array string in same as array and only you want output.

clothing=new Array('T shirt black - $23','Sweater black - $34','Hoodie shirt black - $87');


for (i=0; i<clothing.length; i++) {
    var a = clothing[i].split(" - ");
    $('#item').append('<option value = "'+a[1]+'">'+a[0]+'</option>');
}

http://jsfiddle.net/nilesh026/6qg8C/1/

Nilesh patel
  • 1,216
  • 2
  • 14
  • 38