Country selection using dropdown.

[MWoods]

Hi. My first post here.

I have an established site but would like to improve a checkout page. On it I have java code to calculate appropriate postage rate.

Currently I have UK, Europe and World radio inputs but would like a drop down of all countries to return the relevant postage zone rate for the existing Javascript code;

Select Your Carriage:


<input type="radio"
checked name="cost3" value="0"
onclick="typeOfCarriage('uk');calculate()">
UK
<input type="radio" name="cost3" value="3"
onclick="typeOfCarriage('europe');calculate()">
Europe
<input type="radio"
name="cost3" value="4.5"
onclick="typeOfCarriage('world');calculate()">
World
<input type="button" name="calcButton"
value="Calculate Total" onclick="calculate()"><br><br>
<div align=center><b></h2><h4>Total: English Pounds GBP </b>
<input
type="text" size="7" name="cost" value="0"
onfocus="setTimeout('defocus()',1)">


If anyone more in the know could suggest how a dropdown of countries could be used instead of this radio method I would be very grateful, please?!

Cheers, Mark (Nottingham).

 

[craftyclicks]

You can get a full list of countries by grabbing a piece of something like osCommerce. Once you have the drop down list you can attach an onchange or onclick event to it and handle it a similar same way as before - i.e. call

typeOfCarriage(this.selectedIndex);calculate();

There will now be a lot more different shipping rates to figure out! In the function typeOfCarriage in place of the string it took before you will now get an int and you can have a case switch to do different things depending on the selected country.

Hope this makes sense.

 

[MWoods]

Thanks

for the VERY prompt reply, Craftyclicks!

I'm afraid I know very little about Javascript - I have the list of countries as options already on my page elsewhere but at the moment I believe there are only radio, button, label or form options for "input type".

Could you find time to explain to me how a Java-fool such as myself could create the required drop down menu, please? Functions and the calling of them is a dark art to me.

Cheers, Mark.

 

[craftyclicks]

Tried to PM you, but turns out I'm to new to this forum for this ;-)

OK,

No problem. I see what you are after. Have a look at
www dot craftyclicks dot co dot uk/downloads/samples_action/oscommerce/create_account.php

This is not exactly what you are after, but notice how the country dropdown behaves - if you select anything but UK, the 'Find Address' button disappears.

Your handler could do some maths rather than hide buttons.

I can send you the code for this tomorrow. Let me know your email address. I'm on adam at craftyclicks dot co dot uk.

Cheers,
Adam

 

[craftyclicks]

Hi Mark,

Had a quick look at your site html. Here is what should do the job:

1. Modify JS function calculate and add one new function as such:

function calculate() {
  basicprice = roundOff(Number(CheckNull(document.BuyForm.qty1.value) * document.BuyForm.cost1.value));

  document.BuyForm.cost.value = roundOff(Number(basicprice) + Number(document.BuyForm.carriage_amount.value));
  document.BuyForm.cost1.value = 9.99;
}

function calculate_new(ship_price) {
  basicprice = roundOff(Number(CheckNull(document.BuyForm.qty1.value) * document.BuyForm.cost1.value));
  document.BuyForm.cost.value = roundOff(Number(basicprice) + Number(ship_price));
  document.BuyForm.cost1.value = 9.99;
  document.BuyForm.carriage_amount.value = Number(ship_price);
}

2. Add the country drop down list as such:

<select name="country" onclick="calculate_new(this.value);" onchange="calculate_new(this.value);">
<option value="2.00">Germany</option>
<option value="0.00" SELECTED>United Kingdom</option>
<option value="2.50">United States</option>
</select>

3. Add more countries to your list. You can grab a list off Wikipedia (en dot wikipedia.org/wiki/ISO_3166-1).

I tried not to change your JS too much in case something else relies on it too.

Hope this works for you.

Adam

 

[MWoods]

Code now integrated.

A quick note to thank you SO much again, Adam!

I appear to now have a customer-friendly payment page!

You are a star!

Many thanks for your help - I'd never have done it without you..

Cheers, Mark.

:goodjobsign: