Braintree插件未加載Django

Question

我整合braintree到我django項目，並有一個問題drop-in支付形式，它不加載，任何一個可以幫我看看我的模板，我失去了一些東西，不能看到什么是錯的。 我正在閱讀有關此問題的文檔 ，並使用此示例，僅針對django進行了重新制作，這是我的模板，更多的tags charge_form和braintree_javascript_code已加載到base.html 。

{% extends "base.html" %}


{% block charge_form %}


<div class="container">
    <div class="row">
       <div class="col-xs-12 col-sm-6 col-sm-offset-3">
          <form class="" action="" method="post" id="example_form">
             {% csrf_token %} 
             <div id="dropin-container"></div>
             <input type="submit" value="Pay 300$" name="" id=""/>
          </form> 
       </div> 
    </div>
</div>
{% endblock %}


{% block braintree_javascript_code %}

<script src="https://js.braintreegateway.com/js/braintree-2.24.1.min.js"></script>
<script type="text/javascript">
    var client_token = '{{ request.session.braintree_client_token }}'; 
    braintree.setup(client_token, "dropin", {
        container: "dropin-container";
    });
</script>
{% endblock %}

Answer 1

我已經通過建立自己的自定義表格進行braintree付款來解決了這一問題。 我沒有解決為什么他們的dropin不能加載到我的模板中的問題，並且我不喜歡托管字段的方法，這很好，我只是不喜歡不觸摸，不設置樣式或修改i-frame形式，所以我用bootstrap3制作了一個表單，並在braintree.setup()傳遞了表單ID。

{% extends "base.html" %}

{% block braintree_charge_form %}

<div class="row">
    <p style="padding:60px"></p>
</div>


<div class="container">
    <div class="row">
       <div class="col-xs-12 col-sm-6 col-sm-offset-3">
          <form class="" action="" method="post" id="example_form">
             {% csrf_token %} 
            <div class="form-group">
                <label for="card-number">Card Number</label>
                <input type="" class="form-control" id="card-number" placeholder="Card Number">
              </div>
              <div class="form-group">
                <label for="security-code-field">CVV</label>
                <input type="" class="form-control" id="security-code-field" placeholder="CVV">
              </div>
              <div class="form-group">
                <label for="expiration-date">Expiration Date</label>
                <input type="" class="form-control" id="expiration-date" placeholder="Expiration Date">
              </div>
              <button type="submit" class="btn btn-default">Submit</button>
          </form> 
       </div> 
    </div>
</div>
{% endblock %}


{% block braintree_javascript_code %}

<script src="https://js.braintreegateway.com/js/braintree-2.24.1.min.js"></script>
<script type="text/javascript">
    var client_token = '{{ request.session.braintree_client_token }}'; 
    braintree.setup(client_token, "custom", {
        id: "example_form";
    });
</script>
{% endblock %}