Octopus系列之各个页面调用示例2

判断登陆的调用

#if(${islogin})

<span>

    ${Oct_Welcome}

    or

    <a href="${siteurl}customer/logout/" class="red" rel="nofollow">${Oct_LogOut}</a>

</span>

#else

<span>

    <a href="${siteurl}customer/login/" class="red" rel="nofollow">${Oct_Sign_In}</a>

    or

    <a href="${siteurl}customer/create/" class="red" rel="nofollow">${Oct_Register}</a>

</span>

#end

View Code

更新购物车数量

<select name="qty"

        data-pid="${cartitem.product.productid}"

        data-cartitemid="${cartitem.id}"

        data-action="updatecartitem"

        onchange="UpdateQty(this)">

    #foreach($i in $quantity)

    #if($cartitem.Quantity==$i)

    <option value="$i" selected="selected">$i</option>

    #else

    <option value="$i">$i</option>

    #end

    #end

</select>

View Code

调用支付方式

 1 #foreach($pay in $paylist)

 2 #if(${pay.IsDefault}==1)

 3 <input type="radio" name="rad_payment_method" value="${pay.PayCode}" />

 4 <label for="">

 5 <img src="http://pay.gob2cpay.com/images/mailpay.gif" />(Pay With Credit Card)

 6 </label>

 7 #else

 8 <input type="radio" name="rad_payment_method" value="${pay.PayCode}" />

 9 <label for="">

10 <img src="http://pay.gob2cpay.com/images/mailpay.gif" />(Pay With Credit Card)

11 </label>

12 #end

13 #end

View Code

提交订单

 1 <div class="section">

 2 <div class="step_title subtitle" style="text-align: left;">

 3 ${Oct_Order_Review}

 4 </div>

 5 <div class="step div_txt_f1" style="border: solid 1px #d5d5d5; background-color: #f4f4f4">

 6 <div class="scCartAmountSum">

 7 <table id="subTotal" class="widget clearfix">

 8 <tbody>

 9 <tr>

10 <!-- subtotal -->

11 <th>

12 ${Oct_Subtotal}(${cart.Count}${Oct_Items}):

13 </th>

14 <td>

15 <strong id="ot_subtotal">${cart.DCartSubTotal}</strong>

16 </td>

17 </tr>

18 <tr id="shippingInsuranceCombine">

19 <!-- Shipping Insurance combine-->

20 <th>${Oct_Shipping_Charges_Insurance_1}:</th>

21 <td><strong id="ot_combine_shippnig_insurance">${ship.DShippingPrice}</strong></td>

22 </tr>

23 <tr>

24 <td colspan="3"></td>

25 </tr>

26 </tbody>

27 <!-- Grand Total -->

28 <tfoot>

29 <tr id="cartAmount">

30 <th width="100%">${Oct_Grand_Total}:</th>

31 <td><strong id="ot_total">${ordertotal}</strong></td>

32 </tr>

33 </tfoot>

34 </table>

35 </div>

36 <div style="text-align: center; margin: 10px;">

37 <span style="padding: 5px 10px">

38 <a class="cart_back back" href="javascript:void(0)">${Oct_Back}</a>

39 </span>

40 <img data-theme="img"

41 src="images/buttons/proceed_to_checkout.gif"

42 style="border-width:0px; cursor:pointer" onclick="CreateOrder();" />

43 </div>

44 </div>

45 </div>

View Code

购物车调用

#if(${cart.count}==0)

<table id="carttable" cellpadding="0" cellspacing="0" border="0" style="width:100%">

    <thead>

        <tr>

            <td class="img">${Oct_Item}</</td>

            <td class="lt">${Oct_Item_Description}</td>

            <td>${Oct_Item_Price}</</td>

            <td>${Oct_Quantity}</td>

            <td>${Oct_Price}</td>

            <td>${Oct_Remove}</td>

        </tr>

    </thead>

    <tbody>

        <tr>

            <td colspan="6" style="text-align:left;padding:20px;line-height:25px; border-bottom:none">

                <h3 style="font-size:16px;"><b>${Oct_Cart_Empty_Tips}</b></h3>

                ${Oct_Cart_Empty_Tips_1}<br>

                ${Oct_Cart_Empty_Tips_2}

            </td>

        </tr>

        <tr>

            <td colspan="6" align="center" style="border-top:none; padding:10px 0 10px 0">

                <a href="${siteurl}">

                    <img src="${themeurl}images/buttons/continue_shopping.gif" style="cursor: pointer;" />

                </a>

            </td>

        </tr>

    </tbody>

</table>

#else

<table id="carttable" cellpadding="0" cellspacing="0" border="0" style="width:100%">

    <thead>

        <tr>

            <td class="img">${Oct_Item}</</td>

            <td class="lt">${Oct_Item_Description}</td>

            <td>${Oct_Item_Price}</</td>

            <td>${Oct_Quantity}</td>

            <td>${Oct_Price}</td>

            <td>${Oct_Remove}</td>

        </tr>

    </thead>

    <tbody>

        #foreach($cartitem in $cart.CartItems)

        <tr>

            <td class="img">

                <a title="$cartitem.product.name" href="$cartitem.product.url">

                    <img src="$cartitem.product.Images.smallimg"

                         title="$cartitem.product.name"

                         alt="$cartitem.product.name"

                         width="85" />

                </a>

            </td>

            <td class="lt">

                <a title="$cartitem.product.name"

                   href="$cartitem.product.url">

                    $cartitem.product.name

                </a>

                <br />

                #foreach($d in $cartitem.Attributes)

                <b>$d.key: </b>

                &nbsp;-&nbsp;

                $d.value<br />

                #end

            </td>

            <td>

                <font style="text-decoration:line-through;color:#000">

                    ${cartitem.product.normalprice}

                </font>

                <br />

                <font style="color:#880000;">

                    ${cartitem.product.saleprice}

                </font>

                <br />

                <font style="color:#880000;">

                    <span>SAVE&nbsp;</span>${cartitem.DSaveValue}

                </font>

                <br />

                <div style="background: url(${themeurl}images/icons/off.gif); height: 23px; width: 77px; color: #fff;

                            font-weight: bold; margin-left: 30px; text-align: left;">

                    <div style="padding-top:7px;padding-left:10px;">

                        $oct.DelLastChar(${cartitem.saveoff},"%")

                    </div>

                </div>

            </td>

            <td>

                <script type="text/javascript">

                   

                </script>

                <input type="button" style="padding: 4px; border: solid 1px #d0af76;background-color: #feefbc; color: #af666a; cursor: pointer;" 

                       value="-" 

                       onclick="NumDec(this);">

                <input name="qty" type="text" value="$!{cartitem.Quantity}" class="cartqt"

                       data-pid="${cartitem.product.productid}"

                       data-cartitemid="${cartitem.id}"

                       data-action="updatecartitem"

                       onchange="NumCheck(this);">

                <input type="button" style="padding: 4px; border: solid 1px #d0af76;background-color: #feefbc; color: #af666a; cursor: pointer;"

                       value="+" 

                       onclick="NumAdd(this);">

            </td>

            <td> ${cartitem.DSubtotal}</td>

            <td>

                <input style="padding: 2px; border: solid 1px #d0af76;background-color: #feefbc; color: #af666a; cursor: pointer;"

                       type="button"

                       data-pid="${cartitem.product.productid}"

                       data-cartitemid="${cartitem.id}"

                       data-action="deletecartitem"

                       value="${Oct_Remove}"

                       name="btnRemove"

                       title="${Oct_Remove}" 

                       onclick="DeleteCartItem(this)" />

            </td>

        </tr>

        #end

    </tbody>

    <tfoot>

        <tr>

            <td colspan="6">

                <div style="text-align:center;">

                    ${Oct_Your_Total_Savings}

                    <span class="carttext">

                        <strong>-${cart.DCartSaveValue}</strong>

                    </span>

                </div>

            </td>

        </tr>

        <tr>

            <td colspan="6" style="background-color:#efefef;padding:10px;" valign="bottom">

                <div style="float:left;width:60%;text-align:left; ">

                    <div style="padding:20px 0px;">

                        <!--${cart.Rcode}-->

                        #if(${cart.Rcode}!=${statuscode.OutPut})

                        #if(${cart.Rcode}==${statuscode.NoCoupon})

                        <div class="div_code">

                            <!--不存在-->

                            ${Oct_Your_Coupons_Is_Invalid}

                        </div>

                        #elseif(${cart.Rcode}==${statuscode.CouponExpire})

                        <div class="div_code">

                            <!--已经过期-->

                            ${Oct_Your_Coupons_Is_Invalid}

                        </div>

                        #elseif(${cart.Rcode}==${statuscode.CouponFrozen})

                        <div class="div_code">

                            <!--被冻结-->

                            ${Oct_Your_Coupons_Is_Invalid}

                        </div>

                        #elseif(${cart.Rcode}==${statuscode.CouponNotApply})

                        <div class="div_expire">

                            <!--不满足最低金额条件-->

                            ${Oct_Not_Apply_Tips}

                            <div style="margin:5px 0">

                                ${Oct_Coupons_Details}:

                                <span class="carttext">

                                    ${Oct_Above} ${cart.Coupon.DCouponMinimumOrder},${Oct_You_Can_Get} ${cart.DCouponSaveTotal} ${Oct_Off}

                                </span>

                            </div>

                        </div>

                        #elseif(${cart.Rcode}==${statuscode.Success})

                        <div class="div_code">

                            <!--应用优惠码成功-->

                            ${Oct_Your_Coupons_Is}:${cart.CouponCode}

                            <div style="margin:5px 0">

                                ${Oct_You_Can_Save_Amount}:

                                <span class="carttext">${cart.DCouponSaveTotal}</span>

                            </div>

                        </div>

                        #else

                        ${ERROR_UNKNOWN_ERROR}

                        #end

                        #end

                    </div>

                </div>

                <div style="float:right;width:40%;">

                    #if(${cart.Rcode}==${statuscode.Success})

                    <div class="cartprice">${Oct_Subtotal}:<span class="carttext">${cart.DCartOrderTotal}</span></div>

                    <div class="cartprice">${Oct_Coupon_Save}:<span class="carttext">-${cart.DCouponSaveTotal}</span></div>

                    <div class="cartprice"></div>

                    <hr />

                    #end

                    <div class="cartprice" style="font-size:18px;margin:10px 0">

                        ${Oct_Cart_Total}

                        <span>

                            (${cart.count}&nbsp;${Oct_Items}):

                        </span>

                        <span style="font-size:26px;color:#880000">

                            <b>${cart.DCartSubTotal}</b>

                        </span>

                    </div>

                </div>

                <div style="clear:both">

                </div>

            </td>

        </tr>

        <tr>

            <td colspan="6" style="border:none; padding:10px 0 10px 0">

                <div class="div_txt_f1" style="border: solid 1px #cc0000; margin: 10px 0; padding: 10px;

                            vertical-align: middle; text-align: left; ">

                    <span style="margin:5px; background-color:#CC0000; color:#fff; font-weight:bold; padding:3px 10px;">

                        ${Oct_Save_Your_More_Money}

                    </span>

                    <span style="margin: 0 5px; font-weight: bold;">${Oct_Enter_Your_Coupon_Code}:</span>

                    <input type="text" id="txt_code" style="border: solid 1px #ccc; width: 150px; height: 16px;" value="$!{cart.CouponCode}" />

                    <input type="button" id="btnApplyCoupon" value="$!{Oct_Apply}" style="padding: 3px 7px; border: solid 1px #d0af76;

                                background-color: #feefbc; color: #af666a; cursor: pointer;" onclick="ApplyCoupon();" />

                    <span style="padding: 5px">

                        <a href="${siteurl}help" style="text-decoration:underline">

                            ${Oct_How_Can_I_Get_Coupon_Code}

                        </a>

                    </span>

                </div>

                <!--<div>

                    ${cart.CartSubTotal}<br />

                    ${cart.DCartSubTotal}<br />

                    ${cart.CartOrderTotal}<br />

                    ${cart.DCartOrderTotal}<br />

                    ${cart.CartSaveValue}<br />

                    ${cart.DCartSaveValue}<br />

                    ${cart.CouponSaveTotal}<br />

                    ${cart.DCouponSaveTotal}<br />

                </div>-->

            </td>

        </tr>

        <tr>

            <td align="center" colspan="6" style="border:none; padding:10px 0 10px 0">

                <div style="float:left;">

                    <img title="${Oct_Continue_Shopping}" src="${themeurl}images/buttons/continue_shopping.gif" style="cursor: pointer;" />

                </div>

                <div style="float: left; margin-left: 330px; background-color: #008800; height: 35px; line-height: 35px; border: 1px solid; border-radius: 5px;">

                    <a title="${Oct_Checkout_As_Guest}" href="${siteurl}Checkout.ashx"

                       style="font-size:16px; font-weight:bold; text-decoration:underline;color:#fff;padding:3px 10px;">

                        ${Oct_Checkout_As_Guest}

                    </a>

                </div>

                <div style="float:right;">

                    <img data-islogin="${islogin}" data-theme="img"

                         title="${Oct_Proceed_To_Checkout}" id="CheckoutbyLogin"

                         src="${themeurl}images/buttons/proceed_to_checkout.gif" style="cursor: pointer;" onclick="CheckLogin(this);" />

                </div>

            </td>

        </tr>

    </tfoot>

</table>

#end

View Code

创建订单js

function CreateOrder() {

    //MyRequestHelper.wsurl = "/Checkout.ashx";



    var BillingJson = JSON.stringify($("form[name='BillingaddressForm']").serializeArray());

    var ShippingJson = JSON.stringify($("form[name='ShippingaddressForm']").serializeArray());

    var PaymentJson = JSON.stringify($("form[name='PaymentForm']").serializeArray());



    var chk = $("input[name='rad_Address']:checked").val();

    if (chk == 1) {

        ShippingJson = BillingJson;

    }



    var ShippingCode = $("input[name='rad_shipping_method']:checked").attr("data-code");

    //var PaymentCode = $("input[name='rad_payment_method']:checked").val(); radio

    var PaymentCode = $("select[name='rad_payment_method']").val(); //select



    var OrderRemark = $("#OrderRemark").val();



    //信用卡信息

    //var params = "action=submitOrder" + "&";

    //params += "BillingJson=" + BillingJson + "&"

    //params += "ShippingJson=" + ShippingJson + "&";

    //params += "PaymentJson=" + PaymentJson + "&";



    //params += "PaymentCode=" + PaymentCode + "&";

    //params += "OrderRemark=" + OrderRemark + "&";

    //params += "ShippingCode=" + ShippingCode;



    //alert(params);

    //MyRequestHelper.ExeCallFunByParms2(params, JumpPaymentUrl, CommonError);



    jQuery.ajax({

        url: "/Checkout.ashx",

        type: "POST",

        data: {

            action: "submitOrder",

            BillingJson: BillingJson,

            ShippingJson: ShippingJson,

            PaymentJson: PaymentJson,

            PaymentCode: PaymentCode,

            OrderRemark: OrderRemark,

            ShippingCode: ShippingCode

        },

        dataType: "html",

        timeout: 8000,

        beforeSend: function () {



        },

        success: function () {



        },

        complete: function () {



        },

        error: function () {



        }

    });

}

View Code

优惠码代码

<div>

<style type="text/css">

.sale_shop { margin: 5px 0; font-family: Arial, Helvetica, sans-serif; font-weight: bold; text-align: center; border: 1px solid #990000; width: 960px; margin- top: 10px; }

.sale_shop_top { height: 25px; background: #000; color: #fff; line-height: 25px; }

.sale_shop_bt { background: url(http://pic1.fitflopshops.com/56/Sale-Promotion_bg1.jpg) no-repeat; height: 220px; }

.sale_shop_bt span { display: block; height: 60px; line-height: 60px; font-size: 40px; }

.sale_sb { width: 724px; margin: 0px auto; padding-top: 10px; }

.sale_sb_shop { width: 173px; height: 136px; float: left; margin-right: 10px; padding: 0px; }

.sale_sb_shop span { font-size: 50px; }

.sale_sb_shop font { display: block; }

.sale_sb_bt { padding-top: 0px; font-size: 14px; color: #333; padding-bottom: 5px; margin-top: 26px; }

.sale_sb_bt strong { font-size: 20px; color: #000; }

</style>

<div style="margin:10px 0;padding:20px 10px;background-color:#fdf2c7">

<font style="font-size:24px;color:red"><b>Free Message : Order Over £100,Free shippig Global!!!</b></font>

</div>

<div class="sale_shop">

<div class="sale_shop_bt">

<div class="sale_sb">

<div class="sale_sb_shop">

<span style="color: Black">$25</span> <font style="font-size: 22px; padding: 11px 0 46px;">

off,over $400

</font> <font style="font-size: 16px; color: #F00;">codeoff25USD</font>

</div>

<div class="sale_sb_shop">

<span style="color: Black">$15</span> <font style="font-size: 22px; padding: 11px 0 46px;">

off,over $300

</font> <font style="font-size: 16px; color: #F00;">codeoff15USD</font>

</div>

<div class="sale_sb_shop">

<span style="color: Black">$10</span> <font style="font-size: 22px; padding: 11px 0 46px;">

off,over $200

</font> <font style="font-size: 16px; color: #F00;">codeoff10USD</font>

</div>

<div class="sale_sb_shop" style="margin-right: 0px;">

<span style="color: Black">$5</span> <font style="font-size: 22px; padding: 11px 0 46px;">

off,over $100

</font> <font style="font-size: 16px; color: #F00;">codeoff5USD</font>

</div>

<div style="clear: both;">

</div>

<div class="sale_sb_bt">

<strong>

<font style="color: #F90;">Register,</font> get <font style="font-size: 25px;

color: #F00;">$5</font> immediately

</strong><br />



</div>

</div>

</div>

</div>

</div>

View Code

不要和Action重名

            var theForm = document.forms['form1'];

            if (!theForm) {

                theForm = document.form1;

            }

            function PostBack(action, obj) {

                if (!theForm.onsubmit || (theForm.onsubmit() != false)) {

                    var data = Utils.DomSerialize(obj);

                    //alert(data);

                    alert(theForm.action);//注意这个地方 尽量不要这样写 否则会和 表单的action属性产生冲突

                    theForm.action.value = action;

                    alert(theForm.action.name);

                    theForm.data.value = data;

                    theForm.submit();

                }

            }

View Code

 

多选属性四种形式代码

attr_color_radio
attr_radio
attr_text
attr_dropdown