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 %}