CODEWITHSUNDEEP
javascript
Yaelix
Yaelix

Reputation: 5

Showing Array result on an input text js

i am trying to show the price of each item on the price input, i am not able to make the function work. i am not sure how to write the string on or if i am even doing the function correctly. can you please help me? thanks!

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Price Calculation</title>
</head>

<body>
<Label>Choose Item</Label>
<select onChange=".......">
  <option>Tomatoes</option>
  <option>Lettuce</option>
  <option>Potato</option>
  <option>Carrots</option>
  <option>Artichoke</option>
</select>
<br/>
<Label>Price</Label>
  <input type="text" id="price" />
<br/>
<script type="text/javascript">
  var veggy = new Array ()
  veggy ["Tomatoes"] = 5.99 
  veggy ["Lettuce"] = 7.66 
  veggy ["Potato"] = 4.52 
  veggy ["Carrots"] = 2.13 
  veggy ["Artichoke"] = 10.58

function ()
{
    var veggy = document.getElementById("price")
}
</script>
</body>
</html>

Upvotes: 0

Views: 33

Answers (1)

tymeJV
tymeJV

Reputation: 104775

A couple things to change here:

You'd want an object with each choice as a key, and each price as a value - not an array Call your function onchange and pass in the select element via this

//Make veggy an object
var veggy = {};
veggy["Tomatoes"] = 5.99;
veggy["Lettuce"] = 7.66;
veggy["Potato"] = 4.52;
veggy["Carrots"] = 2.13; 
veggy["Artichoke"] = 10.58;

Change your select onChange:

<select onChange="getPrice(this);">

And your function:

function getPrice(select) {
    document.getElementById("price").value = veggy[select.value];
}

Upvotes: 1

Related Questions