2012-01-10 20 views
7

Soru olarak, jQuery UI'sinin Selectable ve Draggable işlevlerini, kullanıcının birden çok divs seçebildiği bir çalışma sürükle bırak arabirimiyle birleştirmeye çalışıyorum ve bu divleri jQuery Droppables. Gördüğünüz gibijQuery UI - Sürüklenebilir ile Birleştirilebilir Kombinasyonu

$('tr').selectable({ 
     filter: 'div', 
     selected: function(event, ui) { 
      $(ui.selected).draggable({ 
       containment: 'document', 
       axis: 'y', 
       snap: true, 
       snapMode: 'inner', 
       revert: 'invalid', 
       opacity: 0.8, 
       drag: function(e, ui) { 
        $('.ui-selected').css({ 
         top : ui.position.top //Y-Axis Only 
        }); 
        $('.ui-selected').addClass('ui-draggable-dragging'); 
       }, 
       stop: function() { 
        $('.ui-selected').removeClass('ui-selected ui-draggable'); 
       } 
      }); 
     } 
    }); 

, jQuery UI öğeleri ekler bilinen sınıfları ekleyerek denedim: Burada

Kullanıcı bir tablodaki bir satır boyunca div'leri seçmek için izin vermek zorunda koddur sürüklenmekte/seçili/etc olmakla birlikte, gerçek olarak sürüklenebilen gibi görünen tek öğe, kullanıcının tıkladığıdır (aslında sürükleniyor).

arzum kullanıcı tüm seçili grubu sürüklemek var ve onlara Draggables gibi tüm hareket sahip olmaktır (yani: vb Droppable sabitleyebilir geçersiz üzerinde dönmek)

kimse bunun nasıl bir fikrin var mı ya da buradan nereye gitmek?

Ayrıca burada bir jsfiddle tam olarak ne demek (ve Bu konuda şu anda olduğum yerde) göstermektir. Sonuçlar görünümünü yeniden boyutlandırmanız gerekebilir, böylece tablo hücreleri aynı genişlikte olur.

cevap

1

Davranışı simüle edin. (Özel stil eklemek, vs mesela onay kutusunu) manuel olarak seçilebilir olarak

  1. birden öğeyi seçerek

    sadece onları işaretlemek
  2. bu öğeleri tek tek gizler özel klon helper : function(){ return "<p>custom item</p>" }, tanımlamak için kullanılması sürüklenebilir seçeneği helper sürüklerken. Ve istediğiniz gibi özelleştirebilirsiniz.
  3. Seçilen öğeleri kullanarak uygun yere eklenecek özel bir bırakma uygulaması.
İlgili konular