Question

ok, so I’m a complete noob when it comes to jQuery, but this is something I want to change over the next year or so if I can find the time!!

I have the following for the dropdown options

<select id="shipping_method_id" name="shipping_method_id">
    <option value="6">North Island - New Zealand</option>
    <option value="7">South Island - New Zealand</option>
    <option value="8">Australia</option>
</select>

What I want to have is when someone selects Australia from the list I want it to show a div.

When someone selects an option from the list, the page reloads and updates the shipping price.

This is probably really really simple, but I just can’t get it working, I’ve tried this http://jsfiddle.net/JSyLV/910/ but it won’t work 🙁

Answer 1

You need to use the jQuery .change event.

jQuery('#shipping_method_id').change(function(){           
    if(jQuery(this).val() === '8'  ){
        jQuery("#hide_my_ass").slideDown();
    }
});

http://jsfiddle.net/JSyLV/920/

EDIT

jQuery('#shipping_method_id').change(function(){           
    window.location = window.location + '?postPrice=' + jQuery(this).val();
});​

Then in PHP you have access to the get variable $_GET[‘postPrice’] which you can then output as the price.
http://jsfiddle.net/JSyLV/931/