简单形式不能在提交时忽略模态

时间:2017-03-02 20:41:43

标签: javascript jquery ruby-on-rails ajax twitter-bootstrap-3

我有一个简单的表格,用户可以在哪里留言并一键确认付款... 仅确认付款且模式未关闭。 如果我在我的地址中添加<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> <h4 class="modal-title" id="myModalLabel">Payment confirmation</h4> </div> <%= simple_form_for(@booking, url: pay_booking_path(@booking), method: :patch, remote: true ) do |f| %> <div class="modal-body"> <h4> Price : <strong><%= @booking.max_booking_price %>$</strong></h4> <div class="motivations"> <p>Why do you want to make this trip, tell us a bit about you</p> <%= f.input :motivation_message, label: false %> </div> </div> <div class="modal-footer"> <%= f.button :submit, class: "btn btn-primary" %> </div> <% end %> </div> </div> </div> :提交模式已关闭,但付款未确认... 我缺少什么?

 <div class="modal-footer" >
     <%= f.button :submit, class: "btn btn-primary", "data-dismiss"="modal"%>
 </div>

如果我按照这种方式关闭,但付款不起作用

<script>
$('.btn').on("click", function(event) {
    event.preventDefault();
    $('#myModal').modal( 'hide' );
});
</script>

修改

我也试图用一些js修复它,但我对此感到不舒服:这就是我试过的......

stock.picking

2 个答案:

答案 0 :(得分:0)

尝试更改data-dismiss="modal"以匹配模型的ID,即data-dismiss="myModal"。未经测试。

答案 1 :(得分:0)

抱歉 - 这不是答案,但我没有足够的代表发表评论。是否有此功能附带的标准测试代码,如RSpec或Minitest?那可能会说明什么不起作用?

[编辑 - 包括以下评论的回答]

您在hide id上呼叫#modal。但modal是一个班级?试试

$('.modal').modal( 'hide' );

也许可以尝试close而不是hide?如果您想使用id,请使用#myModal。只是大声猜测!

史蒂夫。