だから私はそれらを設定する方法をググググしてきました、私は結局このコードで終わってしまいました。
<script>
$('#reportform')
.bind("ajax:success", function(data, status, xhr) {
$('#reportalert').text('Done.');
});
.bind("ajax:error", function(xhr, status, error) {
$('#reportalert').text('Failed.');
});
</script>
<h2>Review Driver</h2>
<p>Fill out your review of the driver</p>
<div class="hero-unit form-signin" id="reportformdiv">
<%= form_for(@report, html: { id: "reportform" }, remote: true, update:
{ success: "response", failure: "error"} ) do |t| %>
<p id="reportalert"></p>
<%= t.text_field :plant_site, placeholder: "Plant Site" %>
<%= t.text_field :route_number, placeholder: "Route Number" %>
<%= t.text_field :driver_name, placeholder: "Driver name if available" %>
<%= t.date_select :date_recorded, html: { class: "input-block-level" } %>
<%= t.text_field :action, placeholder: "Action taken" %>
<%= t.text_area :report_body, placeholder: "What you witnessed",
style: "height: 300px;",
class: "input-block-level" %>
<%= t.submit "File Report", class: "btn btn-primary btn-large" %>
<% end %>
</div>
しかし、それは機能しておらず、理由がわかりません。何か間違ったことをしたのは間違いありません。RoRを初めて使用するので、このリモートを宣言できるという事実を気に入っています。コールバックを設定する方法を理解します。準備は万端です:)よろしくお願いします。
Railsのwiki によると、次のコードは機能するはずです。
<script>
$(document).ready(function(){
$('#reportform').on('ajax:success', function(e, data, status, xhr){
$('#reportalert').text('Done.');
}).on('ajax:error',function(e, xhr, status, error){
$('#reportalert').text('Failed.');
});
});
</script>
Rails 3.2.14およびjquery-Rails 3.0.4で同様のコードが私のために働きました
それが役に立てば幸い。
Rails 5.1なので、response、status、xhrはevent.detailから抽出する必要があります: https://edgeguides.rubyonrails.org/working_with_javascript_in_Rails.html#Rails-ujs-イベントハンドラ
これは可能な解決策の1つです。
$(document).on('ajax:success', '#reportform', event => {
const [response, status, xhr] = event.detail;
});
ターボリンク互換
<script type="text/javascript">
$(document).on('ajax:success', 'a[data-remote].watching', function(e, data, status, xhr){
});
</script>
これを試して:
JavaScriptコードをdocument ready
:
<script>
$(document).ready(function(){
$('#reportform')
.bind("ajax:success", function(data, status, xhr) {
$('#reportalert').text('Done.');
});
.bind("ajax:error", function(xhr, status, error) {
$('#reportalert').text('Failed.');
});
})
</script>