ansaurus

Question

javascript if drop down selected then set value of text box

Answer 1

A:

Please format the code you posted, this is possible. Just as you say catch the onChange event. I would serialize the value of the drop down element somehow. A dash or underscore or something, then do a split() on the value and store the appropriate splits in the appropriate hidden input value fields.

Eg using prototype for brevity:

function changeHandler(evt) {
    var selected = evt.target[evt.target.selectedIndex];
    var values = selected.value.split("-");
    $('hidden1').value = values[0];
    $('hidden2').value = values[1];
}

Myles 2009-11-14 20:34:37

Answer 2

A:

I took the liberty of changing your method name from SetShipping to setShipping to keep constant your naming convention. Quite frankly I couldn't be bothered to reformat but I tested so have fun playing around with it.

<html>
<head>

<script type="text/javascript">
function setShipping (objDropDown)
{
    var objHidden = document.getElementById("shipping");
    var type = objDropDown.options[objDropDown.selectedIndex].text.substring(objDropDown.options[objDropDown.selectedIndex].text.indexOf('-')+2, objDropDown.options[objDropDown.selectedIndex].text.length);
    objHidden.value = type; 
}


function setShippingtype (objDropDown)
{
    var objHidden = document.getElementById("shippingtype");
    var type = objDropDown.options[objDropDown.selectedIndex].text.substring(0, objDropDown.options[objDropDown.selectedIndex].text.indexOf('-')-1);
    objHidden.value = type; 
}


function setShippinglocation (objDropDown)
{
    var objHidden = document.getElementById("shippinglocation");
    objHidden.value = objDropDown.value;
}

function showEntry(obj,optionValue)
{
    //hide all entry selections onchange
    document.getElementById("pickup").style.display="none";
    if(obj.value=="pickup")
    {
        document.getElementById(optionValue).style.display="inline"; 
    }  
}
</script>
</head>
<body>
<form id="myform">

<br />
shippingselectbox
<br />
<select onchange="showEntry(this,this.value);setShippingtype(this);setShipping(this);" name="shippingselectbox">
  <option value="">Shipping Options</option>
  <option value="pickup">Pickup - no charge</option>
  <option value="UPS">UPS Standard Shipping - 3.00</option>
  <option value="Overnight">Overnight Delivery - 14.00</option>
</select>
<br />
<br />
pickup 
<span id="pickup" style="display:none;">
<select name="pickup" onchange="setShippinglocation(this)">
  <option>Please Choose a Location</option>
  <option value="Billings">Billings, MT</option>
  <option value="Livingston">Livingston, MT</option>
  <option value="Miles City">Miles City, MT</option>
  <option value="Cody">Cody, WY</option>
  <option value="Sheridan">Sheridan, WY</option>
</select>
</span>
<br />
<br />
<br />
shipping (set hidden form tag - shipping amount for paypal)<br />
<input name="shipping" id="shipping" type="text" value=""/>
<br />
<br />
<br />
shippingtype (set hidden form tag - variable for paypal to send to Chris)<br />
<input name="shippingtype" id="shippingtype" type="text" value=""/>
<br />
<br />
<br />
shippinglocation  (set hidden form tag -  variable for paypal to send to Chris)<br />
<input name="shippinglocation" id="shippinglocation" type="text" value=""/>
</form>
</body>
</html>

Ambrosia 2009-11-16 03:29:45

ansaurus

tags:

views:

answers:

javascript if drop down selected then set value of text box

related questions