0

私はほぼ 1 週間、bigcartel onlineshop テンプレートをいじり回しており、既存のテーマを自分の想像力に合うように編集しています。

オンライン販売に関する私の国の法的要件を満たすために、私の顧客が私のショップの利用規約を読み、理解し、同意したことを示すチェックボックスを含める必要があります。要約すると、誰も読んでいない部分です。 D

まず、テキストを含むチェックボックスをセクションに挿入してみました。

<input id="agb_check" name="agb_check" type="checkbox" required /><span id="agb_txt">SOME TEXT.</span>

ただし、それは送信ボタンには影響しませんでしたが、国を選択するとすぐに、送料の計算に使用される「更新」ボタンに影響を与えました。

次に、送信ボタンに onclick イベント ハンドラーを追加して、ページの読み込みをブロックしようとしました。

<button id="checkout-btn" class="button" onclick="validiere()" title="Checkout" type="button">Checkout</button>

このスクリプトを私のヘッドセクションに追加しました：

function validiere(){ 
    if(document.getElementById("agb_check").checked){
        document.getElementById("cart-form").submit();
    } 
    else {
        window.stop();
        document.getElementById("agb_text").style.color="red";
    }
}

まあ-それもうまくいきませんでした。

何か提案はありますか？

サイトは次のとおりです: explore.dlld-fashion.de

基本的に、送料を再計算しようとすると表示される「チェックボックスが必要です」というポップアップは完璧です。

お時間をありがとうございました。ドイツからよろしくお願いします。

デニズ

HTML フォーム コード:

     <form id="cart-form" {% unless cart.shipping.enabled or cart.discount.enabled %}class="no_options"{% endunless %} method="post" action="/cart">
  <div id="cart_description">
    <section id="cart_items">
      <ul>
        {% for item in cart.items %}
        <li class="cart_item {% unless item.product.has_default_option %}with_option{% endunless %}" id="item-{{ item.id }}">          
          <div class="item_image"><img src="{{ item.product.image | product_image_url size:"thumb" }}" alt="Photo of {{ item.name }}"></div>          
          <dl>
            <dt><a href="{{ item.product.url }}">{{ item.product.name }}</a></dt>
            <dd class="item_price">{{ item.unit_price | money_with_sign }}{% if item.quantity > 1 %}<span class="item_quantity">(x{{ item.quantity }})</span>{% endif %}</dd>
            <dd class="quantity_input" style="display:none">{{ item | item_quantity_input }}</dd>
            {% unless item.product.has_default_option %}<dd class="item_option">{{ item.option.name }}</dd>{% endunless %}
          </dl>

          <a href="#" class="remove_item" title="Remove item from cart">Remove item</a>
        </li>
        {% endfor %}         
      </ul>
    </section>

    {% if cart.shipping.enabled or cart.discount.enabled %}
    <section id="cart_options">
      <ul>
        {% if cart.shipping.enabled %}
        {% if cart.shipping.strict %}
        <li id="shipping_option">
          <label for="country">Shipping</label>
          {{ store.country | country_select }}

          {% if cart.shipping.pending %}
            {% if cart.country %}
            <span class="no_shipping">We don't ship to {{ cart.country.name }}</span>
            {% endif %}
          {% endif %}
        </li>
        {% endif %}
        {% endif %}

        {% if cart.discount.enabled %}
        <li id="cart_discount" class="cart_item">
          {% if cart.discount.pending %}
            <label id="cart_discount_label" for="cart_discount_code">Discount</label>
            {{ cart.discount | discount_code_input }}
          {% elsif cart.discount.free_shipping %}
             <label for="cart_discount_code">Discount</label>        
            <p>{{ cart.discount.name }}</p>         
          {% else %}
            <label for="cart_discount_code">Discount</label>        
            <p>{{ cart.discount.name }}</p>
          {% endif %}
        </li>
        {% endif %}
      </ul>

      <div class="cart-update">
        <button id="update-btn-footer" class="update-btn button disabled" name="update" type="submit" title="Update your cart total"><span>Update total</span></button>
      </div>    
    </section>
    {% endif %}
  </div>

  <section id="cart_summary">
    <ul>
      <li>
        <h3>Items</h3>
        <span>{{ cart.subtotal | money_with_sign }}</span>
      </li>
      {% if cart.shipping.enabled %}
      <li id="cart-shipping-tax">
        <h3>Shipping</h3>
        {% if cart.shipping.pending %}
          {% if cart.country %}
          <span class="shipping-amount">Select another country</span>
          {% else %}
          <span class="shipping-amount">Select country</span>
          {% endif %}
        {% else %}
          <span class="shipping-amount">{{ cart.shipping.amount | money_with_sign }}</span>
        {% endif %}
      </li>
      {% else %}
      <li id="cart-shipping-tax" class="not_set">
        <h3>Shipping</h3>
        <span>Applicable fees apply</span>
      </li>        
      {% endif %}

      {% if cart.discount.enabled %}
        {% if cart.discount.pending %}

        {% elsif cart.discount.free_shipping %}
        <li>
          <h3>Discount</h3>
          <span>Free shipping!</span>
        </li>
        {% else %}
        <li>
          <h3>Discount</h3>
          <span>-{{ cart.discount.amount | money_with_sign }}</span>
        </li>
        {% endif %}
      {% endif %}
      <li id="cart_total">
        <h3>Total</h3>
        <h2>{{ cart.total | money_with_sign }}</h2>
      </li>                              
    </ul>

    <button id="checkout-btn" class="button" onclick="validiere()" title="Checkout" type="button">Checkout</button>

  <input id="agb_check" name="agb_check" type="checkbox" required /><span id="agb_txt">Hiermit erkläre ich mich mit den geltenden AGB's einverstanden.</span>


  </section>
</form>
4

3 に答える 3

0

関数を次のように変更すると、機能するはずです。

function validiere(){ 
    if(document.getElementById("agb_check").checked){
        document.getElementById("cart-form").submit();
    } 
    else {
        document.getElementById("agb_text").style.color="red";
    }
    return false;
}
于 2013-08-01T20:25:49.357 に答える
0

書きます

$("#checkout-btn").click(function(event)
    {
        event.preventDefault();
    });

デフォルトの動作を防止する (送信)

また、ちょうど

document.getElementById('theFormId').onsubmit = function() {                
            if(!validate())
                return false;
            }   
            else{
             return true;
            }
}

動作するはずです。

于 2013-08-01T20:26:22.420 に答える
0

バリデーション関数は、フォームの送信ボタンから呼び出すことができます。検証に失敗した場合は false を返す必要があります。

于 2013-08-01T20:25:48.450 に答える