在 Rails 中提交表单后，Bootstrap 模式不会关闭 [英] Bootstrap modal not dismissing after form submit in Rails

问题描述

我的 Rails 3 应用程序中的引导模式有问题.它目前处理提交和更新数据库的审查表单，但提交表单时模式不会关闭.我试过将此添加到表单提交按钮:

:data =>{:解雇 =>模态"}

但它会关闭模态而不执行更新操作.这是我的模态代码:

<% if current_user == nil %><%其他%><div id="reviewModal" class="modal hidefade" tabindex="-1" role="dialog" aria-labelledby="reviewModalLabel" aria-hidden="true"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button><h3 id="reviewModalLabel">写评论</h3>

<div class="modal-body"><%= form_for(review_ballot, :remote => true, :html => {:class => 'review_ballot'}) 做 |f|％＞<h4>您的分数:</h4><%= f.label("score_1", content_tag(:span, '1'), {:class=>"review", :id=>"1"}) %><%= radio_button_tag("review[score]", 1, current_user_review == 1, :class => 'review_button')%><%= f.label("score_2", content_tag(:span, '2'), {:class=>"review", :id=>"2"}) %><%= radio_button_tag("review[score]", 2, current_user_review == 2, :class => 'review_button')%><%= f.label("score_3", content_tag(:span, '3'), {:class=>"review", :id=>"3"}) %><%= radio_button_tag("review[score]", 3, current_user_review == 3, :class => 'review_button')%><%= f.label("score_4", content_tag(:span, '4'), {:class=>"review", :id=>"4"}) %><%= radio_button_tag("review[score]", 4, current_user_review == 4, :class => 'review_button')%><%= f.label("score_5", content_tag(:span, '5'), {:class=>"review", :id=>"5"}) %><%= radio_button_tag("review[score]", 5, current_user_review == 5, :class => 'review_button')%><br/><h4>你怎么看?</h4><%= f.text_area :review_text, :rows =>3、:cols =>10％＞<%= hidden_​​field_tag :venue_id, @venue.id %>

<div class="modal-footer"><button class="btn" data-dismiss="modal" aria-hidden="true">关闭</button><%= submit_tag "保存评论", :class =>btn btn-警告"%><%结束%>

这里是 review_ballot 方法的场地助手

模块 VenuesHelperdef review_ballot如果@review = current_user.reviews.find_by_venue_id(params[:id])@审查别的current_user.reviews.new结尾结尾def current_user_review如果@review = current_user.reviews.find_by_venue_id(params[:id])@review.score别的不适用"结尾结尾结尾

我现在不知道该尝试什么.我已经谷歌搜索并没有任何运气.我该如何解决这个问题?

我的临时解决方案 - 我已经删除了 :remote =>true 来自模态并在控制器操作中重定向访问者，所以现在我不必担心它会被解雇.

这显然很笨拙/hacky，所以如果有人能帮我解决这个问题，我仍然会喜欢它.愿意按需提供更多代码/信息.

解决方案

就您而言，我的意思是您没有上传任何图像.所以你可以简单地调用ajax来提交.这是一个简单的代码

$(document).ready(function(){$('#submit_button_id').click(function() {var valuesToSubmit = $("#form_id").serialize();$("#modal_id").modal('hide') ;$.ajax({url: "/控制器/方法",数据:值提交，类型:POST/GET/PUT"}).成功(功能(数据，状态){$("#id_if_div_where_you_want_to_show_updated_data").html(数据);});返回假；});});

已编辑

控制器方法如下所示

def 方法做你想做的事@object = Model.some_queries渲染:模板=>"path_to_view_file like controller_name/method_name", :layout =>错误的结尾

I'm having trouble with a bootstrap modal in my Rails 3 app. It currently handles a review form that submits and updates the DB just fine, but the modal doesn't close when the form is submitted. I've tried adding this to the form submit button:

:data => {:dismiss => "modal"}

But it closes the modal without executing the update action. Here's my modal code as it stands:

<!-- Review Modal -->
<% if current_user == nil %>
<% else %>
<div id="reviewModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="reviewModalLabel" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="reviewModalLabel">Write a review</h3>
  </div>
  <div class="modal-body">
  <%= form_for(review_ballot, :remote => true, :html => {:class => 'review_ballot'}) do |f| %>
    <h4>Your score:</h4>
    <%= f.label("score_1", content_tag(:span, '1'), {:class=>"review", :id=>"1"}) %>
    <%= radio_button_tag("review[score]", 1, current_user_review == 1, :class => 'review_button')%>
    <%= f.label("score_2", content_tag(:span, '2'), {:class=>"review", :id=>"2"}) %>
    <%= radio_button_tag("review[score]", 2, current_user_review == 2, :class => 'review_button')%>
    <%= f.label("score_3", content_tag(:span, '3'), {:class=>"review", :id=>"3"}) %>
    <%= radio_button_tag("review[score]", 3, current_user_review == 3, :class => 'review_button')%>
    <%= f.label("score_4", content_tag(:span, '4'), {:class=>"review", :id=>"4"}) %>
    <%= radio_button_tag("review[score]", 4, current_user_review == 4, :class => 'review_button')%>
    <%= f.label("score_5", content_tag(:span, '5'), {:class=>"review", :id=>"5"}) %>
    <%= radio_button_tag("review[score]", 5, current_user_review == 5, :class => 'review_button')%>
  <br />
    <h4>What'd you think?</h4>
  <%= f.text_area :review_text, :rows => 3, :cols => 10 %>
  <%= hidden_field_tag :venue_id, @venue.id %>
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    <%= submit_tag "Save review", :class => "btn btn-warning" %>
    <% end %>
  </div>
</div>

And here's the venue helper for the review_ballot method

module VenuesHelper
  def review_ballot
    if @review = current_user.reviews.find_by_venue_id(params[:id])
      @review
    else
      current_user.reviews.new
    end
  end

  def current_user_review
    if @review = current_user.reviews.find_by_venue_id(params[:id])
      @review.score
    else
      "N/A"
    end
  end
end

I'm at a loss for what to try now. I've Googled around and haven't had any luck. How do I fix this?

Edit: My temporary solution - I've removed :remote => true from the modal and redirected the visitor in the controller action, so now I don't have to worry about it being dismissed.

It's obviously clunky/hacky, so I'd still love it if someone could help me solve this. Willing to provide more code/info on demand.

解决方案

In Your case, I mean You are not uploading any images. So you can simply go for ajax calling to submit. Here is a simple code

$(document).ready(function(){

  $('#submit_button_id').click(function() {  
    var valuesToSubmit = $("#form_id").serialize();
    $("#modal_id").modal('hide') ;

    $.ajax({
      url: "/controller/method",
      data: valuesToSubmit,
      type: "POST/GET/PUT"
      }).success(function(data, status){
        $("#id_if_div_where_you_want_to_show_updated_data").html( data );
    });

    return false; 
  });
});

Edited

Controller method looks like the following

def method
  Do what you want to do
  @object = Model.some_queries
  render :template => "path_to_view_file like controller_name/method_name", :layout => false
end

这篇关于在 Rails 中提交表单后，Bootstrap 模式不会关闭的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！