Я использую модальную загрузку в своем приложении Rails. Код, который у меня есть прямо сейчас:

Индексная страница:

    <button type="button" class="btn btn-primary" data-amount="30" data-toggle="modal" data-target=".bs-example-modal-sm">Process Payment</button>

    <%= render 'point_transactions/payment'%>

Модальное окно JQuery Bootstrap:

$('#myModal').on('shown.bs.modal', function() {
  $('#myInput').focus()
})

Моя форма обрабатывает Braintree Payment

<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
  <div class="modal-dialog modal-sm">
    <div class="modal-content">
      <%=form_for point_transactions_path, url: point_transactions_path do |f| %>
        <div id="payment-form"></div>
        <br>
          <%=f .submit 'Submit', class: 'btn btn-success btn-lg' %>
            <%end%>
    </div>
  </div>
</div>

<script>
  braintree.setup('____', "dropin", {
    container: "payment-form"
  });
</script>

Каждый раз, когда я загружаю страницу индекса, я также визуализирую форму оплаты. Если я нажму на кнопку, появится модальное окно jQuery.

  1. Как я могу отобразить форму ПОСЛЕ того, как пользователь нажмет на кнопку - я думаю, она будет в jQuery?

  2. Моя кнопка включает data-amount = "30". Как я могу передать параметр data-amount моему контроллеру через jQuery?

Спасибо за помощь.

0
Dudis 6 Янв 2016 в 06:19

2 ответа

Лучший ответ

Проблема решается следующим образом:

JQuery:

$(document).on("click", ".open-AddPointDialog", function () {

     var myPoint = $(this).data('points');
     $(".modal-body #point_transaction_points").val( myPoint );
});

HTML POP UP форма

<div class="modal fade" id="addPointDialog" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
  <div class="modal-dialog modal-sm">
    <div class="modal-content">
        <div class="modal-body">
          <%=form_for @point_transaction , url: point_transactions_path do |f| %>
            <div id="payment-form"></div>
            <br>
             <%= f.hidden_field :points %>
          <%= f.submit 'Submit', class: 'btn btn-success btn-lg' %>
          <%end%>
        </div>
    </div>
  </div>
</div>

Кнопка

<a data-toggle="modal" data-points="30" class="open-AddPointDialog btn btn-success big" href="#addPointDialog"><i class="fa fa-hand-o-right hided-icon big"></i> Buy Points </a>
0
Dudis 7 Янв 2016 в 02:27

В качестве попытки ответить на ваш второй вопрос, я предполагаю, что вы хотите вернуть значение 30 своему контроллеру. Если это так, вы можете просто добавить его к своему URL-адресу в качестве параметра запроса.

form_for point_transactions_path, url: point_transactions_path(amount: 30) do |f|

Обратно в свой контроллер, вы можете добраться до него вот так

params[:amount]  #=> 30
0
Andrew Griffith 6 Янв 2016 в 09:44