0
我有一个列表项,其中包含我想要编辑的名称。当我的.editActivity按钮被点击时,我使用Jquery来改变列表项的名字,这很好用。我想用Jquery的Ajax来更新我的数据库中的名称。我觉得问题发生在我的activities_controller.rb或routes.rb但不确定。使用Jquery Ajax Ruby on Rails更新数据库
<ul class="list-group-sortable" id="Activities" >
<h1 align = "center">Activities</h1>
<!-- List each activity in database -->
<% @activities.each do |activity| %>
<li class="list-group-item" id="item" style="list-style: none;">
<label class="my_label"><%= activity.a_name %></label>
<!-- Edit activity -->
<!-- link_to 'edit activity', edit_activity_path(activity) do %>-->
<button class="editActivity" style="border:none; padding:0; background-color: transparent">
<i class="fa fa-pencil fa-fw" aria-hidden="true" title="Edit" id="editActivity"></i>
</button>
<!-- end %>-->
</li> <!-- End of list item -->
<% end %> <!-- End of if statement -->
<% end %> <!-- End of activity loop -->
这是我的Jquery改变名称和Ajax:
//Edit Activity
$('#Activities li .editActivity').click(function() {
var name = $(this).closest('li').text();
$('span').text("text is: " + name);
var input = $('<input id="attribute" class="textbox" type="text" value="' + name + '" />')
$(this).closest('li').append(input);
input.select();
input.blur(function(event) {
var text = $('input:text').val();
$(event.target).closest('li').find('label').text(text);
$('#attribute').remove(); //removes the newly created text box
//ajax request to update database
$(document).ajaxError(function(){
alert("Error with AJAX call!");
alert($(this).closest('li').attr('id'));
});
$.ajax({
method: 'PUT',
url: '/activities/' + id,
data: { a_name: text}
});
});
});
这是我activities_controller我的更新动作:
def update
@activity = Activity.find(params[:id])
@activity.update_attributes(:a_name)
respond_to do |format|
format.js {}
end
末
氏s是在我的routes.rb:
put '/activities/:id' => 'activities#update'
'update.js.erb'文件包含在ajax调用成功后会呈现的javascript内容(它与'update.html.erb'类似,但是对于JavaScript)。内容取决于你执行'ajax'后你想做什么。 – Gerry