單擊提交按鈕時觸發Ajax調用

Question

在我的Rails 3.1應用程序中，我有一個Jquery對話框，點擊時彈出，並且裏面有一個提交按鈕。我做了一些嘗試，使這個'提交'按鈕阿賈克斯。所以當它被點擊時它會更新預約時間和日期。我有以下代碼：

<% if @booking.id and current_user.is_booking_manager? %> 
<button id="confirm_appointment"> 
    test confirmation 
</button> 
<div style="display:none;"> 
    <div id="confirm_appointment_dialog" title="Test Confirm Booking"> 
     <%= form_for @booking, :url => booking_confirmation_path(@booking), :remote => true do |f| %> 
     <%= f.hidden_field :id %> 
     <%= f.datetime_select :confirmed_appointment %> 
     <br /> 
     <b>Clear provisional appointment:</b><%= check_box_tag "make_unexpected" %> 
     <br /> 
     <%= f.submit :class => 'submit_me' %> 
     <% end %> 
    </div> 
</div> 
<% end %> 

的application.js

$('.submit_me').bind('change', 
function() { 
    $(this).parents('form:first').submit(); 
}); 

有我丟失的東西

Answer 1

在處理JS請求後，您不會更新您的視圖。首先，您需要爲要更新的HTML元素添加一個ID。

你Pastie過這樣的代碼：

<tr> 
    <td><%= f.label :confirmed_appointment %></td> 
    <td> <% f.hidden_field :confirmed_appointment %> 
    <% if @booking.confirmed_appointment %> 
    <%= l @booking.confirmed_appointment %> 
    <% else %> <em>unconfirmed</em> <% end %> </td> 
</tr> 

爲了可以很容易地引用您想在JavaScript中更新的一部分，讓我們的ID添加到TD。

<td id="booking-confirmation"> <% f.hidden_field :confirmed_appointment %> 

之後，你需要在你的views /文件夾中創建一個update.js.erb。現在，你可以把線

$("#booking-confirmation").html("<%= l @booking.confirmed_appointment %>"); 

在那裏，這將尋找與你的HTML ID爲「預訂，確認」字段和更新。

最後，一定要包括

respond_to do |format| 
    format.html 
    format.js 
end 

在你的行動，讓行動來響應JS調用。

Answer 2

變化bind('change') -> bind('click')

好吧，你這樣做，稍有不妥，http://wowkhmer.com/2011/09/19/unobtrusive-ajax-with-rails-31/嘗試使用本指南