ujs + remotipaart - jQueryの `.html（...）`呼び出しを実行すると、追加されたhtmlはテキストになります

Question

私はremotipartと一緒に5を使用しています。 remotipartバージョンです：

gem 'remotipart', github: 'mshibuya/remotipart' 

（この質問の瞬間、現在のコミットが88d9a7d55bde66acb6cf3a3c6036a5a1fc991d5eです）。

multipart: true and remote：trueを持つフォームを送信したい場合添付ファイルを送信しないで、それは素晴らしい動作します。しかし、ファイルを送信すると失敗します。

このような応答を検討し、ケースを説明するために：このレスポンスが実行されると

(function() { 
    modelErrors('<div class=\'alert alert-danger alert-dismissible\' role=\'alert\'>\n <div aria-label=\'Close\' class=\'close fade in\' data-dismiss=\'alert\'>\n <span aria-hidden>\n  &times;\n <\/span>\n <\/div>\n Code can\'t be blank\n<\/div>\n'); 
}).call(this); 

は、すぐに（それはJSあるので）到着した後、フォームが、この場合には（それは予想通り、このように見えます検証エラーが起こることが権利である、とレンダリングされた危険の警告は、テキストで表示されるように右である）：

しかし、私はファイルのフィールドを埋めたときに、全く同じ場合（正確に同じ検証エラーを繰り返し）、for mはかなり異なっています：

あなたが推測できる場合は、内容がテキストとして渡されます。サーバから受信された実際の応答が少し異なります。

<script type="text/javascript">try{window.parent.document;}catch(err){document.domain=document.domain;}</script>(function() { 
    modelErrors('<div class=\'alert alert-danger alert-dismissible\' role=\'alert\'>\n <div aria-label=\'Close\' class=\'close fade in\' data-dismiss=\'alert\'>\n <span aria-hidden>\n  &times;\n <\/span>\n <\/div>\n Code can\'t be blank\n<\/div>\n'); 
}).call(this); 

これは私の応答の実際の身体（それが悪いコピー - ペーストではなく、remotipartによってラップと実際の応答）です。

modalErrors機能はかなり馬鹿です：

function modalErrors(html) { 
    $('#main-modal > .modal-dialog > .modal-content > .modal-body > .errors').html(html); 
} 

（私は、ブラウザのDOMインスペクタでそれらを探してください）jQueryの-追加htmlのチャンクを比較すると、彼らは次のようになります。

グッド：

<div class="alert alert-danger" role="alert"> 
    <ul style="list-style-type: none"> 
    <li>Code can't be blank</li> 
    </ul> 
</div> 

悪い：

Code can't be blank 

私はここで何が欠けていますか？私が必要とするのは、私のresposeが必要なときにhtmlコンテンツを追加できるようにすることです。

Answer 1

iframe-transportという名前のlibは、あとでコンテンツをアンラップし、あたかもajaxで取得されたかのように応答を実行します。私は正気な方法でこのライブラリと相互作用することが見出さソリューションは、別のものを定義することです

try{window.parent.document;}catch(err){document.domain=document.domain;}(function() { 
    modelErrors('\n \n \n  ×\n \n \n Code can\'t be blank\n\n'); 
}).call(this); 

：応答はこのような何かに変換されますので、しかし、タグは、応答から取り除かれ

j/escape_javascriptに似てヘルパーヘルパー、：定期的にAJAXと異なるシナリオ-in remotipartの両方によって送信されるの影響を受けやすいビューで

module ApplicationHelper 

    JS_ESCAPE_MAP = { 
     '\\' => '\\\\', 
     '<' => '\\u003c', 
     '&' => '\\u0026', 
     '>' => '\\u003e', 
     "\r\n" => '\n', 
     "\n" => '\n', 
     "\r" => '\n', 
     '"' => '\\u0022', 
     "'" => "\\u0027" 
    } 

    JS_ESCAPE_MAP["\342\200\250".force_encoding(Encoding::UTF_8).encode!] = '&#x2028;' 
    JS_ESCAPE_MAP["\342\200\251".force_encoding(Encoding::UTF_8).encode!] = '&#x2029;' 

    def escape_javascript_with_inside_html(javascript) 
    if javascript 
     result = javascript.gsub(/(\\|\r\n|\342\200\250|\342\200\251|[\n\r<>&"'])/u) {|match| JS_ESCAPE_MAP[match] } 
     javascript.html_safe? ? result.html_safe : result 
    else 
     '' 
    end 
    end 

    alias_method :jh, :escape_javascript_with_inside_html 

end 

は、私はちょうどj CALを交換二乗平均jhが呼び出されます。例：

modalErrors('<%= j render 'shared/model_errors_alert', instance: @team %>') 

は

modalErrors('<%= jh render 'shared/model_errors_alert', instance: @team %>') 

と交換しました