无法删除表中的项目 Ruby 在轨道上

Question

Im trying to delete an item from a table i generate using a scaffold. I done some research and seen this is a common issue with windows machines where instead of deleting the item it just gets it. This is my destroy method in the controller

 def destroy
    @measurment.destroy
    respond_to do |format|
      format.js
      format.html { redirect_to measurments_url, notice: "Measurment was successfully destroyed." }
      format.json { head :no_content }
    end
  end

This is the fix that I tried below. I added remote: true and class: "delete" to the destroy link in the index page

<td><%= link_to 'Destroy', measurment, method: :delete, data: { confirm: 'Are you sure?', remote: true }, class: "delete" %></td>
      </tr>
  

I then added jquery using yarn add jquery and added //= require jquery //= require rails-ujs to the application.js file. Lastly i created a file in the measurements folder called destroy.js.erb. This contained:

$('.delete').bind('ajax:success', function(){
    $(this).closest('tr').fadeOut();
});

After all that i still cant delete items from the table. Any help would be greatly appreciated

Answer 1

Using Button_to instead of link_to works

Answer 2

If you're using Server-generated JavaScript Responses (SJR) you want to perform the actions directly instead of adding an event handler:

<%= link_to 'Destroy', measurment, method: :delete, data: { confirm: 'Are you sure?', remote: true }, class: "delete", id: "measurment-#{measurment.id}" %>

$("#measurment-<%= @meaurement.id %>").closest('tr')
                                     .fadeOut();

The way that SJR works is that the return javascript is popped into a script tag and executed immediately after the request is completed. However this code has absolutely no idea about which element fired the orginal event so you have to get hacky and unique ids.

If you instead send a JSON request you can write a lot better javascript and not make your server responible for altering the page.

<%= link_to 'Destroy', measurment, method: :delete, 
            data: { 
              confirm: 'Are you sure?', 
              remote: true, 
              type: 'json' 
            }, class: "delete" %>

// place this code in your packs or the assets pipeline
$(document).on('ajax:success', '.delete', function(){
  $(this).closest('tr').fadeOut();
});