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
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
}));
});
}
});
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 $.
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):
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
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>');
}
