nested <div> element inside <button> element to get both links working

Open image here

So here's the situation I am trying to nest a div element ( a paypal button ) and a button element (rails element which submits forms) so on clicking, form gets submitted after paypal successful transaction.currently only one of it works No IDEA ON How to also redirect to a paypal payments page.### Please tell me any other way.if I'm following a wrong path ###. Here's the code

    <%= form_for([@listing, @order]) do |form| %>
   <% if order.errors.any? %>
   <div id="error_explanation">
     <h2><%= pluralize(order.errors.count, "error") %> prohibited this order   from being saved:</h2>

  <ul>
  <% order.errors.full_messages.each do |message| %>
    <li><%= message %></li>
  <% end %>
  </ul>
    </div>
  <% end %>


    <div class="form-group">
   <%= form.label :name %>
    <%= form.text_field :name, class:"form-control" %>
 </div>

 <div class="form-group">
   <%= form.label :size %>
   <%= form.text_field :size, class:"form-control" %>
 </div>

<div class="form-group">
<%= form.label :mobile %>
<%= form.text_field :mobile, class:"form-control" %>
 </div>

  <div class="form-group">
   <%= form.label :city %>
   <%= form.text_field :city, class:"form-control" %>
  </div>    

 <div class="form-group">
   <%= form.label :address %>
   <%= form.text_field :address, class:"form-control" %>
 </div>

 <div class="form-group">
   <%= form.label :PinCode %>
   <%= form.text_field :PinCode, class:"form-control" %>
  </div>
<div class="form-group">
  <%= form.label :Landmark %>
  <%= form.text_field :Landmark, class:"form-control" %>
  </div>



  <div class="form-group">
    <%= form.label :Description %>(if any special changes)
    <%= form.text_field :Description, class:"form-control" %>
 </div>

 <div class="form-group">
   <%=form.submit%>
   <%=link_to "Checkout" %>
 </div>




   <button  type="submit"    onClick="placeOrder(this.form)" class="button button2">  

<!-- Set up a container element for the button -->
<div id="paypal-button-container"> </div>

<!-- Include the PayPal JavaScript SDK -->
<script src="https://www.paypal.com/sdk/js?client-id=sb&currency=USD"></script>

<script>
    // Render the PayPal button into #paypal-button-container
    paypal.Buttons({

        // Set up the transaction
        createOrder: function(data, actions) {
            return actions.order.create({
                purchase_units: [{
                    amount: {
                        value: '0.01'
                    }
                }]
            });
        },

        // Finalize the transaction
        onApprove: function(data, actions) {
            return actions.order.capture().then(function(details) {
                // Show a success message to the buyer
                alert('Transaction completed by ' + details.payer.name.given_name + '!');
            });
        }





    }).render('#paypal-button-container');


</script>


    <%=form.submit%>
       Place Order</button>

If the form submission depends on the paypal transaction success, then submit the form only ater the transaction was approved on the onApprove callback. Something like this:

onApprove: function(data, actions) {
            return actions.order.capture().then(function(details) {
                // Show a success message to the buyer
                alert('Transaction completed by ' + details.payer.name.given_name + '!');
                yourForm = document.getElementById('id_of_the_form');
                Rails.fire(yourForm, 'submit');
            });
        }