양식을 HTML에 삽입 한 후 제출하지 마십시오

Question

braintree 지불 양식을 제출하면 .html()을 사용하여 이전 양식을 대체하고 새 서식을 삽입합니다. 양식이 제대로 삽입되지만 내가 작성하고 제출을 누르면 아무 일도 일어나지 않습니다. 서버 로그 또는 Chrome 개발자 도구 (네트워크 또는 콘솔 탭)에는 활동이 없습니다. 왜 이런 경우인지/문제가 무엇인지에 대한 도움은 좋습니다. 감사!

브레인 트리 형태 :

<div id="braintree_<%= order.id %>" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
    <h3 id="myModalLabel">Payment for <%= order.name %></h3> 
</div> 
<div class="modal-body" id="braintree_body_<%= order.id %>"> 
<%= render 'orders/order_cc_charge', order: order %> 
<% total = order.projected_total %> 
<% if order.payments.present? %> 
    <table class="table table-hover table-condensed table-bordered"> 
    <thead> 
     <th>Payment $</th> 
     <th>Notes</th> 
     <th>Balance</th> 
    </thead> 
    <% order.payments.each do |payment| %> 
    <% total -= payment.amount %> 
    <tbody> 
     <tr> 
     <td><%= number_to_currency(payment.amount) %></td> 
     <td><%= payment.notes %></td> 
     <td><%= number_to_currency(total) %></td> 
     </tr> 
    </tbody> 
    <% end %> 
    </table> 
<% end %> 
    <%= form_tag create_transaction_url, remote: true, id: "braintree-payment-form_#{order.id}" do %> 
    <div class="input-prepend"> 
     <span class="add-on"> <i class="fa fa-usd"> </i> </span> 
     <%= text_field_tag :amount, total.round(2), class: "input-small" %> 
     <%= hidden_field_tag :order_id, order.id %> 
    </div> 
     <input type="text" size="20" autocomplete="off" data-encrypted-name="number" placeholder="Card #" /> 
     <input type="text" size="4" autocomplete="off" data-encrypted-name="cvv" class="input-mini" placeholder="CVV" /> 
    <p> 
     <label class="inline bold">Expiration Date</label> 
     <input type="text" size="2" name="month" class="input-small" placeholder="Month (MM)" />/<input type="text" size="4" name="year" class="input-small" placeholder="Year (20XX)" /> 
    </p> 
    <%= text_area_tag :notes, nil, placeholder: "Notes", class: "span10" %> 
</div> 
<div class="modal-footer" id="braintree_footer_<%= order.id %>"> 
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> 
    <button type="submit" id="submit" class="btn btn-primary">Submit Payment</button> 
    <% end %> 
</div> 

<script src="https://js.braintreegateway.com/v1/braintree.js"></script> 
<script> 
    var braintree = Braintree.create('<%= j(ENV['CSE_KEY']) %>'); 
    braintree.onSubmitEncryptForm('braintree-payment-form_<%= order.id %>'); 
</script> 
</div> 

<script> 
    $('#braintree_<%= order.id %>').on('show', function() { 
    $("#trucks_refresh").remove(); 
    }); 
    $('#braintree_<%= order.id %>').on('hide', function() { 
    if ($("#trucks_refresh").length) { 
    } 
    else { 
     $(document.body).append('<%= j(render 'deliveries/trucks_refresh_btn') %>'); 
    } 
    }); 
</script> 

컨트롤러 조치 :

def create_transaction 
    result = Braintree::Transaction.sale(
    :amount => params[:amount], 
    :credit_card => { 
     :number => params[:number], 
     :cvv => params[:cvv], 
     :expiration_month => params[:month], 
     :expiration_year => params[:year] 
    }, 
    :options => { 
     :submit_for_settlement => true 
    } 
) 

    @order = Order.find(params[:order_id]) 
    if result.success? 
    @payment = Payment.create(order_id: @order.id, amount: params[:amount], date_received: Date.today, job_id: @order.job_id, client_id: @order.client_id, method: "2", notes: params[:notes]) 
    "<h1>Success! Transaction ID: #{result.transaction.id}</h1>" 
    else 
    "<h1>Error: #{result.message}</h1>" 
    end 
    respond_to do |format| 
    format.js 
    end 
end 

JS 액션 :

$("#braintree_<%= @order.id %>").html('<%= j(render 'deliveries/braintree_modal_body', order: @order) %>'); 

Answer 1

내가 모든 일 DIV 내에서 양식을 이동 지금 형태가 잘 작동합니다. 2 개의 다른 div 내에서 양식을 분할하는 것은 초기 제출 후 제출 버튼이 양식을 올바르게 제출하는 것을 허용하지 않는다고 생각합니다.

<%= form_tag create_transaction_url, remote: true, id: "braintree-payment-form_#{order.id}" do %> 
    <div class="input-prepend"> 
     <span class="add-on"> <i class="fa fa-usd"> </i> </span> 
     <%= text_field_tag :amount, total.round(2), class: "input-small" %> 
     <%= hidden_field_tag :order_id, order.id %> 
    </div> 
     <input type="text" size="20" autocomplete="off" data-encrypted-name="number" placeholder="Card #" class="input-medium" /> 
     <input type="text" size="4" autocomplete="off" data-encrypted-name="cvv" class="input-mini" placeholder="CVV" /> 
     <input type="text" size="2" name="month" class="input-small" placeholder="Month (MM)" />/<input type="text" size="4" name="year" class="input-small" placeholder="Year (20XX)" /> 
    <%= text_area_tag :notes, nil, placeholder: "Notes", class: "span12" %> 
    <%= button_tag "Submit Payment", class: "btn btn-primary btn-block btn-large", type:"submit", id:"submit" %> 
    <% end %> 
<script> 
    var braintree = Braintree.create('<%= j(ENV['CSE_KEY']) %>'); 
    braintree.onSubmitEncryptForm('braintree-payment-form_<%= order.id %>'); 
</script>