Сенча сенсорный SortableList

Question

http://docs.sencha.com/touch/2.3.1/#!/api/Ext.plugin.SortableList

ОБНОВЛЕНО ВОПРОС:

КОД:

Ext.application({ 
    name: 'Fiddle', 

    launch: function() { 
     var templ = new Ext.XTemplate(
     '<tpl if="isActive">', 
      '<div style="color:red" class="', 
      Ext.baseCSSPrefix + 'list-sortablehandle', 
      '">', 
     '</tpl>',  
    '<b>Name: {text}</b>', 
     '<tpl if="isActive">', 
      '</div>', 
     '</tpl>', 
      { 
       // XTemplate configuration: 
       compiled: true, 
       // member functions: 
       isitem2: function (name) { 
        return name == 'item2'; 
       }, 
      } 
); 

     Ext.Viewport.add({ 
      xtype: 'list', 
      itemId: 'dynamicContainer', 
      infinite: true, 
      plugins: 'sortablelist', 
      itemTpl: templ,//'<span style="width:30px;height:20px;background-color:gray;display:block;float:left;" class="' + Ext.baseCSSPrefix + 'list-sortablehandle"></span>{text}', 
      listeners: [{ 
       event: 'dragsort', 
       fn: function (list, row, from, to) { 
        console.log(to); 
       } 
      }], 
      data: [{ 
       text: 'Item 1-Active', 
       isActive:true 
      }, { 
       text: 'Item 2-Active', 
       isActive: true 
      }, 
      { 
       text: 'Item 3-Active', 
       isActive: true 
      }, { 
       text: 'Item 4', 
       isActive: false 
      }, 
        { 
       text: 'Item 5', 
       isActive: false 
      }] 
     }); 

    } 
}); 

See in Action:https://fiddle.sencha.com/#fiddle/3kl

С помощью @mishoboss asnswer https://stackoverflow.com/a/21762299/1405008

Я сделал почти (70%), сделал то, что хочу, но мне нужно ограничить содержимое списка черным, не должен быть переупорядочен пользователем, я запретил пользователю перетаскивать определенную ячейку, но когда пользователь перетаскивает другую ячейку, они могут место, это неактивная ячейка, чтобы изменить порядок этой ячейки. Но это не должно быть так.

Как в моем прикрепленном дне экрана списка, отмеченного красной стрелкой, не следует сортировать.

OLD ВОПРОС Я смотрю в сенча сенсорный документ там встроен плагин называется SortableList.But они никогда не дают и пример источника для того, как использовать этот плагин.

RED: элемент списка не позволяет перетаскивать и сортировать пользователем Yello: Сортируемые элементы списка

Я знаю, что это очень легко достичь с помощью JQuery.

Но я никогда не получаю никаких идей или образцов, чтобы достичь этого через плагин sencha touch.

Также я не хочу добавлять JQuery к моему приложению, потому что это может привести к проблемам с производительностью при использовании с работой ракеты sencha.

Примечание: Также я хочу, чтобы пользователь нажал и удерживал в списке, чтобы перетащить не просто перетаскивание, потому что это повлияет на поведение прокрутки по умолчанию. Помогите пожалуйста.!

Answer 1

Я играю с несколькими часами с сортировочным списком. Вот как я это сделал:

    xtype: 'list', 
        plugins:'sortablelist', 
        itemTpl: '<span class="'+Ext.baseCSSPrefix + 'list-sortablehandle"></span>{text}', 
        listeners: [ 
         { 
          event: 'dragsort', 
          fn: function(list, row, from, to){ 
           alert(to); 
          } 
         } 
        ], 
... 

Обратите внимание, что для работы вам нужен «ручка». Ручка - это область, куда вы нажимаете, и элемент списка перетаскивается. селектор по умолчанию для ручки

'.' + Ext.baseCSSPrefix + 'list-sortablehandle' 

и вы можете определить различный селектор с handleSelector параметра.

Однако я не мог заставить его работать так, как он должен работать. Элементы списка стали перетаскиваемыми, но они не привязаны и не переупорядочиваются. Либо есть проблема с этим, либо я все еще что-то пропущу. Пожалуйста, напишите здесь, если у вас есть успех.

Edit: Я просто проверял это еще раз на Сенча Fiddle: https://fiddle.sencha.com/fiddle/3k3/preview

До сих пор не работает, как ожидалось.