Question

我有一个显示验证错误的模态。我的问题是，每当我关闭模态并再次触发它时，它会重复，然后我必须关闭它两次。

问题是这样的： StackOverflow: PHP Semantic-UI Modal

该解决方案不起作用。我不确定它是否与rails处理partials的方式有关，或者我是否实现了模态错误。我需要帮助了解正在发生的事情以及我如何解决它。

的index.html

<div class="eight wide stackable column">
  <div id="payee_errors"></div>
</div>

错误部分：

<div class="ui modal">
  <div class="header"><%= pluralize(target.errors.count, "error") %> prohibited this  <%= target.class.to_s.underscore.humanize.downcase %> from being saved:</div>
  <div class="content">
    <h3 class="header">
      There were problems with the following fields:
    </h3>
    <div class="ui list">
      <% target.errors.full_messages.each do |msg| %>
          <div class="item">
            <%= msg %>
          </div>
      <% end %>
    </div>
  </div>
  <div class="actions">
    <div class="ui green cancel button">Ok. It won't happen again.     </div>
  </div>
</div>

create.js.coffee

$("#payee_errors").html("<%=escape_javascript(render partial: 'errors' , :locals => {:target => @payee }) %>")
$('.ui .modal').modal('show')

修改

下面的答案让我朝着正确的方向前进。这就是我最终做的事情。他回答的唯一区别是我不得不使用onApprove回调方法隐藏模态。

$('.ui.modal').html('')
$("#payee_errors").html("<%=escape_javascript(render partial: 'errors/errors' , :locals => {:target => @payee }) %>")
$('.ui.modal').modal(
  onApprove: ->
    $('.ui.modal').modal 'hide'
    return
).modal 'show'

Answer 1

问题是当你关闭模态时，你只是隐藏它而不破坏你创建的内容。

解决方法是在关闭它之前清除div，就像那样：

$('.ui .modal').html('')
$('.ui .modal').modal('hide')

Rails语义UI模式创建其他Dom元素

1 个答案: