Was ist der bessere Weg, um eine Drag & Drop-Tabelle in Schienenansichten zu erstellen?

Question

Ich arbeite auf Schienen. In einer meiner Ansichten muss ich eine Liste erstellen, die per Drag-and-Drop sortiert werden kann. Ich habe this way auf Google gefunden. Aber in diesem Tutorial verwendeten sie act_as_list gem. Laut der Dokumentation dieses Edelsteins ist es;

Ein ActiveRecord-Plugin zum Verwalten von Listen.

Ich verwende mongoid. Kann mir jemand vorschlagen, wie ich eine Drag & Drop-Liste in Schienenansichten für mongoDB erstellen kann?

Answer 1

Ich habe Drag & Drop-Tabelle mit dem Edelstein jquery-UI-Schienen erstellen. Hier können Sie weitere Informationen here

mit Jquery ich habe wie dieses getan

jQuery(function($) { 
    if ($('#table_body_id').length > 0) { 
    table_width = $('#table_body_id').width(); 
    cells = $('.table').find('tr')[0].cells.length; 
    desired_width = table_width/cells + 'px'; 
    $('.table td').css('width', desired_width); 
    } 

    $('#table_body_id').sortable({ 
    axis: 'y', 
    cursor: 'move', 
    containment: '.table-responsive', 
    sort: function(e, ui) { 
     ui.item.addClass('active-item-shadow'); 
    }, 
    stop: function(e, ui) { 
     ui.item.removeClass('active-item-shadow'); 
     ui.item.children('td').effect('highlight', {}, 1000); 
    }, 
    update: function(event, ui) { 
     var all_row_ids = $(this).sortable('toArray', { attribute: 'table_row_id' }); 
     $.ajax({ 
     url: 'my_url_to_sort', 
     method: 'POST', 
     data: { 
      ids: all_row_ids 
     }, 
     success: function(){ 
      $('#table_body_id > tr').each(function(i, tr) { 
      $('.index:first', this).html(i + 1); 
      }); 

      console.log("success"); 
     } 
     }); 
    } 
    }); 
}); 

jetzt in Controller-Aktion finden wir Daten mit Positionsfeld aussortieren kann so

def sort 
     params[:ids].each_with_index do |id, index| 
     ModelName.where(id: id).update(position: index+1) 
    end 

    render nothing: true 
    end 

Danke.