Confused by shipping

cowtancowtan Member
in Help edited March 2011
Hi - I'm in the process of setting-up a site for a customer. They sell in the UK and overseas and currently have a simple way of calculating the shipping - £2.50 if the address is in the UK, £6.50 if it is anywhere else.

I've looked to see if it's possible to emulate this using Foxycart but have so far just managed to confuse myself. Is this something it's possible to do? (I'd be happy if it's possible but not straightforward btw.)

Many thanks,
Gordon
Comments
  • lancelance Member, Community Support Member
    Hi Gordon,

    This is definitely possible, but is would require some custom JavaScript in your checkout template. You can see a list of links to different shipping customizations here:

    http://wiki.foxycart.com/v/0.6.0/docs/advanced/forum

    This one, in particular, might be useful to you:

    http://forum.foxycart.com/comments.php?DiscussionID=1441&page=2#Item_10

    Lance
  • Thanks Lance. Just the job.

    cheers,
    Gordon
  • cowtancowtan Member
    OK. I've now got the following which I've put in the head for the checkout template and is doing more or less what I want it to do. I only have one small problem - the shipping is only set to the right value when the country is updated. When I first go to the checkout the shipping is 0.00. It's probably really straightforward but how do I get the function to run when the page first appears.
    function updateMyShippingCost() {
    	var numProducts = fc_json.product_count;
    	var basePrice = 2.95;
    	var increment = 1.00;
    	var country_code = (jQuery("#use_different_addresses").is(":checked") ? $("#shipping_country").val() : $("#customer_country").val());
    	if (country_code != "GB") {
    		basePrice = 8.95;
    		increment = 2.00;		
    	}
    	shippingCost = basePrice + (numProducts - 1) * increment;
    	FC.checkout.config.orderFlatRateShipping = shippingCost;
    }
    
    jQuery("document").ready(function(){
    	FC.checkout.overload("updatePriceDisplay", "updateMyShippingCost", null);
    });
    
  • lancelance Member, Community Support Member
    Gordon,

    You can always call the updatePriceDisplay function when the page loads. This will cause your custom script to fire right away.

    Lance
  • cowtancowtan Member
    edited June 2011
    Thanks Lance. This is what I've now got but it's still not got the right values initially. Is there something specific I should be setting the shipping and category values to in the control panel?

    Gordon
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">;
    
    <html xmlns="http://www.w3.org/1999/xhtml">;
    <head>
    	<title>^^store_name^^ Checkout</title>
    	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    	<link rel="stylesheet" href="https://^^store_domain^^/themes/standard/styles.css"; type="text/css" media="screen" charset="utf-8" />
    
    <script type="text/javascript" charset="utf-8">
    function updateMyShippingCost() {
    	var numProducts = fc_json.product_count;
    	var basePrice = 2.95;
    	var increment = 1.00;
    	var country_code = (jQuery("#use_different_addresses").is(":checked") ? $("#shipping_country").val() : $("#customer_country").val());
    	if (country_code != "GB") {
    		basePrice = 8.95;
    		increment = 2.00;		
    	}
    	shippingCost = basePrice + (numProducts - 1) * increment;
    	FC.checkout.config.orderFlatRateShipping = shippingCost;
    }
    
    jQuery("document").ready(function(){
    	FC.checkout.overload("updatePriceDisplay", "updateMyShippingCost", null);
    	FC.checkout.updatePriceDisplay();
    });
    </script>
    
    </head>
    
    <body id="checkout">
    	<div id="pageContainer" style="width:760px; margin:0px auto;">
    		^^cart^^
    		^^checkout^^
    <script type="text/javascript" charset="utf-8">
    /* <![CDATA[ */
    jQuery(document).ready(function(){
      // add the required class
      jQuery("#customer_phone").addClass("fc_required");
      // add an asterisk to the label
      jQuery("li.fc_customer_phone label.fc_pre").append("<span class=\"fc_ast\">*<\/span>");
      // Now add the onblur error checking events
      jQuery("#customer_phone").blur(function() {
        if (this.value == "") {
          FC.checkout.updateErrorDisplay(this.name,true);
        } else {
          FC.checkout.updateErrorDisplay(this.name,false);
        }
      });
    });
    
    
    /* ]]> */
    </script>	
    
    </div>
    </body>
    </html>
    
    ^^custom_begin^^
     
    <h2>Additional Information</h2>
     
    <fieldset id="fc_custom_fields">
    	<legend>Additional Information</legend>
    	<div class="fc_inner">
    		<div>
    			<h4>Is this a gift?</h4>
    			<p>Enter a personal message</p>
    			<textarea name="Personal_Message" cols="45" rows="3"></textarea>
    		</div>
    	</div><!-- .fc_inner -->
    </fieldset><!-- #fc_custom_fields -->
     
    ^^custom_end^^
    
  • lukeluke FoxyCart Team
    Is there a reason you have HTML outside of your </html> tag? You may want to move that around. Other than that, do you have your category configured to use flat rate shipping? What store is this for so we can take a look?
  • cowtancowtan Member
    The HTML outside the </html> tag is for an additional field as per this information in the wiki - http://wiki.foxycart.com/v/0.7.0/checkout - but let me know if I've misunderstood this?

    I've whispered the site location to you (it's still in development at the moment).

    cheers,
    Gordon
  • lukeluke FoxyCart Team
    Sorry about that, I didn't realize the docs specified that. It does get moved around as part of the processing so that shouldn't be a problem, I was just a bit confused to see this in what you pasted above. I see everything looks just fine in your checkout page.

    Try changing this one thing:
    Replace:
    [code]
    FC.checkout.updatePriceDisplay();
    [code]
    With:
    [code]
    FC.checkout.updateShipping(-1);
    [code]
  • cowtancowtan Member
    Thanks Luke, but that still doesn't seem to be doing the trick. Any other ideas? (Site's supposed to be doing live at the end of the week so I need to find a solution as soon as possible.)

    cheers,
    Gordon
  • fc_adamfc_adam FoxyCart Team
    Hey Gordon,

    That's weird. It should be working fine. It looks like something isn't there on page load for some reason. Can you replace the updateMyShippingCost with this to work out what's going on?
    function updateMyShippingCost() {
    	var numProducts = fc_json.product_count;
    	var basePrice = 2.95;
    	var increment = 1.00;
    	var country_code = (jQuery("#use_different_addresses").is(":checked") ? $("#shipping_country").val() : $("#customer_country").val());
    	if (country_code != "GB") {
    		basePrice = 8.95;
    		increment = 2.00;		
    	}
    	shippingCost = basePrice + (numProducts - 1) * increment;
    alert("numProducts='"+numProducts+"' country_code='"+country_code+"' shippingCost='"+shippingCost+"'");
    	FC.checkout.config.orderFlatRateShipping = shippingCost;
    }
    
  • cowtancowtan Member
    edited June 2011
    Thanks Adam. I've done this and the alert appears when the page first appears, indicating that the function is being fired. Intriguingly (and I have no idea if this is significant or not), if I then change the destination on the form (from United Kingdon to United States for example) then the function seems to be fired twice, with the shipping price only being updated the second time round. Is this what you would expect?

    cheers,
    Gordon

    Update: Adam, I've added in another alert so the last few lines of the function are reading -
    alert("numProducts='"+numProducts+"' country_code='"+country_code+"' shippingCost='"+shippingCost+"'");	
    FC.checkout.config.orderFlatRateShipping = shippingCost;
    alert("orderFlatRateShipping = " + FC.checkout.config.orderFlatRateShipping);
    

    and it looks like the FC.checkout.config.orderFlatRateShipping is being updated OK. It's what happens after this that isn't working quite right.

    Further update: I've tried using firebug to spot what's going on but don't really know enough about what your code is doing to really be able to identify anything.
  • fc_adamfc_adam FoxyCart Team
    @cowtan,

    Maybe try replacing your overload to:
    FC.checkout.overload("updatePrice", "updateMyShippingCost", null);
    

    If that doesn't work, try adding this as the last line of the updateMyShippingCost function
    return shippingCost;
    

    And then change your document ready function to be this:
    FC.checkout.config.orderFlatRateShipping = updateMyShippingCost();
    FC.checkout.updateShipping(-1);
    FC.checkout.overload("updatePriceDisplay", "updateMyShippingCost", null);
    
  • cowtancowtan Member
    Thanks Adam. The first one of your suggestions did the trick. Many thanks for your time on this. Gordon
Sign In or Register to comment.