Jump to content

Javascript change form input to suit selection


kensbeijing
 Share

Recommended Posts

Hi I need some help writing some javascript that will change the value of an input box when I change an option input.This is just an example. Also would it be possible to disable the price input so customers can't change the price?

<form action="whatever"><input type="text" name="price" value="THIS SHOULD CHANGE"><select name="item_name">  <option onChange="SHOULD CHANGE PRICE VALUE TO 1.99" value="Item1">Item1</option>  <option onChange="SHOULD CHANGE PRICE VALUE TO 2.99" value="Item2">Item2</option>  <option onChange="SHOULD CHANGE PRICE VALUE TO 3.99)" value="Item3">Item3</option>  <input type="submit" value="buy"</select>

Link to comment
Share on other sites

<script type="text/javascript">function setPrice(ele) {	var price = document.getElementById("price");	if ele.value == "Item1" price.value = 1.99;	else if ele.value == "Item2" price.value = 2.99;	else if ele.value == "Item3" price.value = 3.99;}</script><!-- ... --><form action="whatever"><input type="text" name="price" id="price" disabled="disabled" value="0"><select name="item_name" onchange="setPrice(this)">  <option value="Item1">Item1</option>  <option value="Item2">Item2</option>  <option value="Item3">Item3</option></select><input type="submit" value="buy" /></form>

But remember it is easy to modify the HTML code post-render and enable the price field, so you should determine the price server-side from the item_name and not from the price field.

Link to comment
Share on other sites

<script type="text/javascript">function setPrice(ele) {	var price = document.getElementById("price");	if ele.value == "Item1" price.value = 1.99;	else if ele.value == "Item2" price.value = 2.99;	else if ele.value == "Item3" price.value = 3.99;}</script><!-- ... --><form action="whatever"><input type="text" name="price" id="price" disabled="disabled" value="0"><select name="item_name" onchange="setPrice(this)">  <option value="Item1">Item1</option>  <option value="Item2">Item2</option>  <option value="Item3">Item3</option></select><input type="submit" value="buy" /></form>

But remember it is easy to modify the HTML code post-render and enable the price field, so you should determine the price server-side from the item_name and not from the price field.

Doesn't seem to work. Nothing happens.
Link to comment
Share on other sites

Sorry forgot some parenthesis in the JS function

function setPrice(ele) {	var price = document.getElementById("price");	if (ele.value == "Item1") price.value = 1.99;	else if (ele.value == "Item2") price.value = 2.99;	else if (ele.value == "Item3") price.value = 3.99;}

Link to comment
Share on other sites

Sorry forgot some parenthesis in the JS function
function setPrice(ele) {	var price = document.getElementById("price");	if (ele.value == "Item1") price.value = 1.99;	else if (ele.value == "Item2") price.value = 2.99;	else if (ele.value == "Item3") price.value = 3.99;}

aaaa, thanks mate!
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...