隐藏的输入没有发布?

时间:2014-10-17 22:49:03

标签: javascript forms post paypal

有人可以告诉我为什么当我选择一个" No"时,突然发现我的一些隐藏输入没有发布。我的收银台上3个单选按钮之一的选项?

http://jsfiddle.net/#&togetherjs=O6ViKmJQRB

继承我的桌子......

            <table class="shop_table">
                <thead>
                    <tr>
                        <th class="product-name">Product</th>
                        <th class="product-total">Total</th>
                    </tr>
                </thead>

                <tbody>
                                            <tr class="cart_item">
                                    <td class="product-name">
                                        <strong>Demo Vacation Home</strong><br /><br />1 adults, 0 children<br />2014-11-21 to 2014-11-23                                <strong class="product-quantity">&times; 1</strong>                                                            </td>
                                    <td class="product-total totalTextTop">
                                        <span class="amount">&#36;1,000.00</span>                                                           </td>
                                </tr>

                                <tr class="cart_item">
                                    <td class="product-name">

                                                                        Refundable Damage Deposit <span style="color: #ff0000;">(not taxed, not included in order total)</span>
                                                                                                         <br/><span style="color: #ff0000; font-size: 10px;">Please note that the Refundable Damage Deposit must be paid within 45 days of your reserved vacation check-in date.<br/>For international creditcard transactions there is an additional 6% surcharge.</span>
                                    </td>
                                    <td class="product-total refundableDamageDepositTextTop">
                                        $<div id="priceDisplayRefundableDamageDeposit" class="priceDisplay">2,000.00</div>                          </td>
                                </tr>

                                <tr class="cart_item">
                                    <td class="product-name">
                                        Cleaning Fee
                                    </td>
                                    <td class="product-total">                          
                                        $<div id="priceDisplayCleaningFee" class="priceDisplay">175.00</div>                            </td>
                                </tr>

                                <tr class="cart_item">
                                    <td class="product-name">
                                        City Occupancy Tax&nbsp;8%
                                                                    </td>
                                    <td class="product-total">                              
                                        $<div id="priceDisplayTaxRate" class="priceDisplay">80.00</div>                         </td>
                                </tr>

                                <tr class="cart_item">
                                    <td class="product-name">

                                        Preheat Pool?&nbsp;&nbsp;<input type="radio" name="preheatPoolSelect" id="preheatPoolYes" value="yes" onclick='showFee("priceDisplayPoolHeating","200.00","poolHeatingFee")' checked><label for="preheatPoolYes">Yes</label>&nbsp;&nbsp;<input type="radio" name="preheatPoolSelect" id="preheatPoolNo" value="no" onclick='clearFee("priceDisplayPoolHeating","poolHeatingFee")'><label for="preheatPoolNo">No</label>
                                    </td>
                                    <td class="product-total">                          
                                        $<div id="priceDisplayPoolHeating" class="priceDisplay">200.00</div>                            </td>
                                </tr>

                                <tr class="cart_item">
                                    <td class="product-name">

                                        Have Pet(s)?&nbsp;&nbsp;<input type="radio" name="havePetsSelect" id="havePetsYes" value="yes" onclick='showFee("priceDisplayPetFee","150.00","petFee")' checked><label for="havePetsYes">Yes</label>&nbsp;&nbsp;<input type="radio" name="havePetsSelect" id="havePetsNo" value="no" onclick='clearFee("priceDisplayPetFee","petFee")'><label for="havePetsNo">No</label>
                                    </td>
                                    <td class="product-total">                          
                                        $<div id="priceDisplayPetFee" class="priceDisplay">150.00</div>                         </td>
                                </tr>

                                <tr class="cart_item">
                                    <td class="product-name">

                                        Property Damage Protection?&nbsp;&nbsp;<input type="radio" name="propertyDamageProtectionSelect" id="propertyDamageProtectionYes" value="yes" onclick='showFee("priceDisplayPropertyDamageProtection","80.00","propertyDamageProtection")' checked><label for="propertyDamageProtectionYes">Yes</label>&nbsp;&nbsp;<input type="radio" name="propertyDamageProtectionSelect" id="propertyDamageProtectionNo" value="no" onclick='clearFee("priceDisplayPropertyDamageProtection","propertyDamageProtection")'><label for="propertyDamageProtectionNo">No</label>
                                    </td>
                                    <td class="product-total">                          
                                        $<div id="priceDisplayPropertyDamageProtection" class="priceDisplay">80.00</div>                            </td>
                                </tr>

                                <tr class="cart_item">
                                    <td class="product-name">
                                        Reservation Fee&nbsp;6%
                                                                    </td>
                                    <td class="product-total">
                                        $<div id="priceDisplayReservationFee" class="priceDisplay">101.10</div>                         </td>
                                </tr>

                                <tr class="cart_item">
                                    <td class="product-name">
                                        <strong>Vacation Package Total</strong>
                                    </td>
                                    <td class="product-total">
                                                                    <strong>$<div id="priceDisplayVacationPackageTotal" class="priceDisplay">1,786.10</div></strong>
                                    </td>
                                </tr>

                                <!--
                                <tr class="cart_item">
                                    <td class="product-name">
                                        <span style="line-height:15px;">&nbsp;</span>
                                    </td>
                                    <td class="product-total">

                                    </td>
                                </tr>
                                -->

                                        </tbody>

                <tfoot>
                    <!--
                    <tr class="cart-subtotal">
                        <th>Cart Subtotal</th>
                        <td>$1,356.10</td>
                    </tr>
                    -->





                    <tr class="order-total">
                        <th>Order Total</th>
                        <td>$<div id="priceDisplayVacationPackageGrandTotal" class="priceDisplay">1,786.10</div></td>
                    </tr>


                </tfoot>

            </table>

带有隐藏输入的表单......

            <form id='paypalCheckout' action='https://www.paypal.com/cgi-bin/webscr' method='post' style="margin-bottom: 10px">
                                    <input type="hidden" name="item_name_1" value="Demo Vacation Home" />
                                    <input type="hidden" name="item_number_1" value="Demo-Vacation-Home" />
            <input type="hidden" name="amount_1" value="1000" />
            <input type="hidden" name="quantity_1" value="1" />

            <!---
            <input type="hidden" name="item_name_" value="Refundable Damage Deposit" />
                                    <input type="hidden" name="item_number_" value="" />
            <input type="hidden" name="amount_" value="" />
            <input type="hidden" name="quantity_" value="1" />
                        -->

            <input type="hidden" name="item_name_2" value="Cleaning Fee" />
                                    <input type="hidden" name="item_number_2" value="Cleaning-Fee" />
            <input type="hidden" name="amount_2" value="175" />
            <input type="hidden" name="quantity_2" value="1" />

            <input type="hidden" name="item_name_3" value="6% Reservation Fee" />
                                    <input type="hidden" name="item_number_3" value="6%-Reservation-Fee" />
            <input type="hidden" name="amount_3" value="101.1" id="reservationFee"/>
            <input type="hidden" name="quantity_3" value="1" />

            <input type="hidden" name="item_name_4" value="8% City Occupancy Tax" />
                                    <input type="hidden" name="item_number_4" value="8%-City-Occupancy-Tax" />
            <input type="hidden" name="amount_4" value="80" />
            <input type="hidden" name="quantity_4" value="1" />

            <input type="hidden" name="item_name_5" value="Pool-heating Fee" class="poolHeatingFee"/>
                                    <input type="hidden" name="item_number_5" value="Pool-heating-Fee" class="poolHeatingFee"/>
            <input type="hidden" name="amount_5" value="200" class="poolHeatingFee"/>
            <input type="hidden" name="quantity_5" value="1" class="poolHeatingFee"/>

            <input type="hidden" name="item_name_6" value="Pet Fee" class="petFee"/>
                                    <input type="hidden" name="item_number_6" value="Pet-Fee" class="petFee"/>
            <input type="hidden" name="amount_6" value="150" class="petFee"/>
            <input type="hidden" name="quantity_6" value="1" class="petFee"/>

            <input type="hidden" name="item_name_7" value="Property Damage Protection" class="propertyDamageProtection"/>
                                    <input type="hidden" name="item_number_7" value="Property-Damage-Protection" class="propertyDamageProtection"/>
            <input type="hidden" name="amount_7" value="80" class="propertyDamageProtection"/>
            <input type="hidden" name="quantity_7" value="1" class="propertyDamageProtection"/>


            <input type='hidden' name='business' value='juliocpreciado@gmail.com' />
            <input type='hidden' name='shopping_url' value='http://www.dreamhomevacationrentals.com/cart/' />
            <input type='hidden' name='lc' value='en_US' />
            <input type='hidden' name='cmd' value='_cart' />
            <input type='hidden' name='charset' value='utf-8'>
            <input type='hidden' name='upload' value='1' />
            <input type='hidden' name='no_shipping' value='2' />
            <input type='hidden' name='currency_code' value='USD' id='currency_code' />
            <input type='hidden' name='custom' value='|||' />
            <input type='hidden' name='notify_url' value='http://www.dreamhomevacationrentals.com/store/ipn/'>
            <input type='hidden' name='return' value='http://www.dreamhomevacationrentals.com/thank-you/' />
            <input id='PayPalCheckoutButton' type='image' src='https://www.paypal.com/en_US/i/btn/btn_xpressCheckout.gif' value='Checkout With PayPal' />

            </form>

以下是javascript的形式......

            <script type="text/javascript">

            //money formatter from... http://stackoverflow.com/questions/9318674/javascript-number-currency-formatting
            Number.prototype.formatMoney = function(decPlaces, thouSeparator, decSeparator) {
                var n = this,
                    decPlaces = isNaN(decPlaces = Math.abs(decPlaces)) ? 2 : decPlaces,
                    decSeparator = decSeparator == undefined ? "." : decSeparator,
                    thouSeparator = thouSeparator == undefined ? "," : thouSeparator,
                    sign = n < 0 ? "-" : "",
                    i = parseInt(n = Math.abs(+n || 0).toFixed(decPlaces)) + "",
                    j = (j = i.length) > 3 ? j % 3 : 0;
                return sign + (j ? i.substr(0, j) + thouSeparator : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + thouSeparator) + (decPlaces ? decSeparator + Math.abs(n - i).toFixed(decPlaces).slice(2) : "");
            };



            function recalculateReservationFee() {

                var vacationRentalPrice = parseFloat(1000);
                var TaxRate = parseFloat(document.getElementById("priceDisplayTaxRate").textContent);
                var CleaningFee = parseFloat(document.getElementById("priceDisplayCleaningFee").textContent);

                var PoolHeating = parseFloat(document.getElementById("priceDisplayPoolHeating").textContent);
                var PetFee = parseFloat(document.getElementById("priceDisplayPetFee").textContent);
                var PropertyDamageProtection = parseFloat(document.getElementById("priceDisplayPropertyDamageProtection").textContent);

                var reservationFeeTarget = vacationRentalPrice + TaxRate + CleaningFee + PoolHeating + PetFee + PropertyDamageProtection;
                var theNewReservationFee = parseFloat((6 * reservationFeeTarget) / 100);

                var formattedNewReservationFee = theNewReservationFee.formatMoney(2,',','.'); // example "$3,543.76"
                document.getElementById("priceDisplayReservationFee").innerHTML = formattedNewReservationFee;
                document.getElementById("reservationFee").value = formattedNewReservationFee;

                //document.write('<br/>The Vars: <br/>' + vacationRentalPrice + '<br/>' + CleaningFee + '<br/>' + TaxRate + '<br/>' + PoolHeating + '<br/>' + PetFee + '<br/>' + PropertyDamageProtection + '<br/>--<br/>' + reservationFeeTarget + '<br/>' + formattedNewReservationFee);


                function recalculateGrandTotal() {

                    var theGrandTotal = vacationRentalPrice + TaxRate + CleaningFee + PoolHeating + PetFee + PropertyDamageProtection + theNewReservationFee;

                    var formattedGrandTotal = theGrandTotal.formatMoney(2,',','.'); // example "$3,543.76"
                    document.getElementById("priceDisplayVacationPackageTotal").innerHTML = formattedGrandTotal;
                    document.getElementById("priceDisplayVacationPackageGrandTotal").innerHTML = formattedGrandTotal;

                }

                recalculateGrandTotal();

            }


            function clearFee(theNamedFee,theNamedClass){
            document.getElementById(theNamedFee).innerHTML = '0.00';

                var elems = document.getElementsByClassName(theNamedClass);
                for(var i = 0; i < elems.length; i++) {
                    elems[i].disabled = true;
                }

                recalculateReservationFee();
            }

            function showFee(theNamedFee,someFee,theNamedClass){
            document.getElementById(theNamedFee).innerHTML = someFee;

                var elems = document.getElementsByClassName(theNamedClass);
                for(var i = 0; i < elems.length; i++) {
                    elems[i].disabled = false;
                }

                recalculateReservationFee();

            }


            </script>

2 个答案:

答案 0 :(得分:1)

您的问题出在您的clearFee功能中。制作元素disabled可以防止它被发送到服务器。

答案 1 :(得分:1)

您可以添加一个脚本,该脚本将在按钮单击时运行。

<input id='PayPalCheckoutButton' type='image' src='https://www.paypal.com/en_US/i/btn/btn_xpressCheckout.gif' onclick="javascript:doSubmit();" value='Checkout With PayPal' />

脚本

<script>
function doSubmit(){
var j=1;
for (i =0; i<=27;i+=4)
{
 if(document.getElementById('paypalCheckout')[i].disabled==false)
{

document.getElementById('paypalCheckout')[i].name='item_name_'+(j);
document.getElementById('paypalCheckout')[i+1].name='item_number_'+(j);
document.getElementById('paypalCheckout')[i+2].name='amount_'+(j);
document.getElementById('paypalCheckout')[i+3].name='quantity_'+(j);
j++;
}

}
return true;
}
</script>