v65:shippingWidget

<v65:shippingWidget></v65:shippingWidget>

Description: Used to display basic shipping information to a customer for a given state.

Optional Attributes:

maxRows: specify what type of pod elements to display

default: 5
usage: <v65:shippingWidget maxRows="5"></v65:shippingWidget>

stateCode: set the default state

default: "CA"
usage: <v65:shippingWidget stateCode="CA"></v65:shippingWidget>

shippingStrategyID: specify which shipping strategy to use if there is more than one

default: is the default shipping strategy
usage: <v65:shippingWidget shippingStrategyID="UUID"></v65:shippingWidget>

shippingTypeID: specify which shipping strategy to use if there is more than one

default: is the first shipping type in the default shipping strategy
usage: <v65:shippingWidget shippingTypeID="UUID"></v65:shippingWidget>

Html Output:

<div id="v65-shippingWidget">

      <form method="post" id="v65-shippingWidgetForm" action="/index.cfm?method=shipping.shippingWidget">

           <input type="hidden" name="shippingStrategyID" value="">
           <input type="hidden" name="shippingTypeID" value="">
           <input type="hidden" name="maxRows" value="5">

           <p>Shipping to:&nbsp;
                <select name="stateCode">
                   <option value="AL">AL</option>
                   <option value="AK">AK</option>  
                   <option value="AZ">AZ</option>  
                   <option value="AR">AR</option>  
                   <option value="CA" selected="">CA</option>  
                   .....  
                </select>
           </p>

     </form>

     <div id="v65-shippingWidgetResults">

          <table width="0" cellspacing="0" cellpadding="0" id="v65-shippingWidgetTable">
          <tbody>
                 <tr>
                    <th class="left">Quantity</th>
                    <th class="right">UPS Ground to CA</th>
                 </tr>
                  <tr class="altRow">
                     <td>1 Bottle</td>
                     <td class="right">$14.63</td>
                  </tr>
                  <tr>
                     <td>2 Bottles</td>
                     <td class="right">$16.07</td>
                  </tr>
                  <tr class="altRow">
                     <td>3 Bottles</td>
                     <td class="right">$17.50</td>
                  </tr> 
                  <tr>
                     <td>4 Bottles</td>
                     <td class="right">$19.25</td>
                  </tr> 
                  <tr class="altRow">
                     <td>5 Bottles</td>
                     <td class="right">$20.83</td>
                  </tr> 
            </tbody></table>

      </div>

</div>

Base CSS from vin65.css:

/*Shipping Widget*/
#v65-shippingWidget { padding: 0px 20px; }
#v65-shippingWidget select { width: 60px; }
#v65-shippingWidgetTable { width: 100%; }
#v65-shippingWidgetTable th { background-color: #666; color: #fff; font-size: 0.917em; padding: 4px; }
#v65-shippingWidgetTable td { color: #000; font-size: 0.917em; padding: 4px; }