как иметь редактируемый список в сенсорном сенча? - PullRequest
1 голос
/ 26 июня 2011
  • Я хочу создать список задач.Итак, я ищу список, который при двойном нажатии элемента позволит мне редактировать элемент, позволяя отображать текстовое поле.Есть идеи ??

Ответы [ 3 ]

1 голос
/ 10 октября 2011

Вот редактируемый список в стиле iPhone

https://github.com/tmanderson/Sencha-Touch-Edit-List

0 голосов
/ 26 ноября 2014

Вот рабочий Пример .
Инкапсулируйте ваши данные в div , который вы хотите редактировать. Дайте атрибут 'data-name' к этому div с тем же именем данных.Захватите событие itemdoubletap и найдите фактическую цель.В этом примере, поскольку данные были ' title ', они дали то же имя атрибуту div

Ext.create('Ext.List', {
                fullscreen: true,
                itemTpl: '<div data-name="title">{title}</div>',
                data: [
                    { title: 'Item 1' },
                    { title: 'Item 2' },
                    { title: 'Item 3' },
                    { title: 'Item 4' }
                ],
                listeners: {
                    itemdoubletap: function (list, index, target, record, e, eOpts) {
                        var actualTarget = e.getTarget('div');
                        if (actualTarget.dataset.name == 'title') {
                            actualTarget.innerHTML = '';
                            var textfield = document.createElement("INPUT");
                            textfield.setAttribute("type", "text");
                            textfield.style.width = '100%',
                            textfield.record = record;
                            textfield.value = record.data[actualTarget.dataset.name];
                            textfield.onblur = function () {
                                if (record.data[actualTarget.dataset.name] != this.value) {
                                    record.data[actualTarget.dataset.name] = this.value;
                                }
                                this.parentNode.innerHTML = this.value;
                            }
                            actualTarget.appendChild(textfield);
                            textfield.focus();
                        }
                    }
                }
            }
0 голосов
/ 27 июня 2011

Просто создайте список, добавьте к нему прослушиватель itemdoubletap, и в этом случае создайте плавающую панель с текстовой областью и прикрепленной кнопкой панели инструментов внутри. Ознакомьтесь с примерами Sencha Touch для справки.

...