Restricting Shipping Options in ShopSite using JavaScript

Forum Forums Tutorials Restricting Shipping Options in ShopSite using JavaScript

This topic contains 0 replies, has 1 voice, and was last updated by  Anonymous 15 years, 10 months ago.

Viewing 1 post (of 1 total)
  • Author
    Posts
  • #48628

    Anonymous
    Participant

    In previous tutorials, we looked at various ways of using JavaScript in ShopSite, specifically on the cart and checkout screens. The focus of this tutorial is to provide you with a way of stopping customers from choosing an incorrect shipping method. The CheckIt function of ShopSite Pro can stop shoppers from selecting (either intentionally or unintentionally) an option that does not apply to them.

    Here is some example JavaScript you can enter in under Commerce Setup -> Order System -> Shopping Cart: JavaScript added at start of built-in CheckIt function:

    Restricting a Single Shipping Option:

     

    try{ 
     if(typeof document.order.shipping[0] != "undefined") { 
        if (document.order.shipping[0].type == "radio") { 
          for (var i=0; i < document.order.shipping.length; i++){ 
            if (document.order.shipping[i].checked){ 
             var rad_val = document.order.shipping[i].value; 
           } 
          } 
         } else { 
            var rad_val = document.order.shipping.value; 
         } 
     
         if (button == "8" && document.order.country.value != "US" && rad_val == "XXX"){                                      
             alert("International customers cannot choose USA ONLY shipping options"); 
                return(false); 
         } 
       } 
     } catch(err){  } 
    

     

    Restricting Two Shipping Options:

     

    try{ 
     if(typeof document.order.shipping[0] != "undefined") { 
        if (document.order.shipping[0].type == "radio") { 
          for (var i=0; i < document.order.shipping.length; i++){ 
            if (document.order.shipping[i].checked){ 
              var rad_val = document.order.shipping[i].value; 
            } 
          } 
         } else { 
               var rad_val = document.order.shipping.value; 
         } 
     
         if (button == "8" && document.order.country.value != "US" && (rad_val == "XXX" || rad_val == "YYY")) {                                      
           alert("International customers cannot choose USA ONLY shipping options"); 
              return(false); 
         } 
        } 
     } catch(err){  } 
    

     

    The above scenario assumes you have one or two shipping options that are only available for US customers. In order to find out what to replace ‘XXX’ and ‘YYY’ with, you would view the page source of your cart screen in your browser and search for the shipping options. Once you locate them in the source code, the variable values you are looking for are contained in the

     

    value = "XXX"

    portion of the code.

    You can go a step further and use Javascript to hide a particular shipping method (once again replacing the XXX and YYY with the value attribute of the shipping options you are restricting):

    Restricting / Hiding a Single Shipping Option:

     

    try{ 
     if(typeof document.order.shipping[0] != "undefined") { 
        if (document.order.shipping[0].type == "radio"){ 
          for (var i=0; i < document.order.shipping.length; i++){ 
            if(document.order.shipping[i].value == "XXX"){ 
             document.order.shipping[i].parentNode.parentNode.style.display = 'none'; 
            } 
            if (document.order.shipping[i].checked){ 
             var rad_val = document.order.shipping[i].value; 
            } 
           } 
          } else { 
             for (var i=0; i < document.order.shipping.length; i++){ 
                 if(document.order.shipping[i].value == "XXX"){ 
                   document.order.shipping[i].style.display = 'none'; 
                 } 
             } 
             var rad_val = document.order.shipping.value; 
           } 
     
           if (button == "8" && document.order.country.value != "US" && rad_val == "XXX"){                                      
              alert("International customers cannot choose USA ONLY shipping options"); 
           } 
         } 
     } catch(err){  } 
    

     

    Restricting / Hiding Two Shipping Options:

     

    try{ 
     if(typeof document.order.shipping[0] != "undefined") { 
         if (document.order.shipping[0].type == "radio"){ 
           for (var i=0; i < document.order.shipping.length; i++){ 
               if(document.order.shipping[i].value == "XXX" || document.order.shipping[i].value == "YYY"){ 
               document.order.shipping[i].parentNode.parentNode.style.display = 'none'; 
            } 
            if (document.order.shipping[i].checked){ 
              var rad_val = document.order.shipping[i].value; 
            } 
          } 
         } else { 
             for (var i=0; i < document.order.shipping.length; i++){ 
                if(document.order.shipping[i].value == "XXX" || document.order.shipping[i].value == "YYY"){ 
             document.order.shipping[i].style.display = 'none'; 
             } 
          } 
          var rad_val = document.order.shipping.value; 
         } 
         
         if (button == "8" && document.order.country.value != "US" && (rad_val == "XXX" || rad_val == "YYY")){                                      
            alert("International customers cannot choose USA ONLY shipping options"); 
         } 
        } 
     } catch(err){  } 
    

     

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.