RailsセマンティックUIモーダル追加のDOM要素の作成

Question

私は検証エラーを表示するモーダルを持っています。私の問題は、モーダルを閉じて再びトリガするたびに重複し、2回閉じる必要があることです。

問題は、ちょうどこのようなものです： StackOverflow: PHP Semantic-UI Modal

ソリューションが動作しないこと。レールがパーシャルを処理する方法に問題があるかどうか、あるいは私がモーダルを間違って実装しているかどうかはわかりません。私は何が起こっているのか、どうやって解決できるのかを理解する助けが必要です。部分的

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')