ExtJS 4 - Как условно редактировать ячейку в сетке? - PullRequest
8 голосов
/ 16 сентября 2011

У меня есть панель сетки с использованием плагина редактирования ячейки.

На этой панели сетки я хочу условное редактирование ячейки следующим образом:

Когда пользователь нажимает на ячейку для редактирования, должно появиться диалоговое окно подтверждения - «Вы хотите редактировать ячейку?»- если он выбирает «Да», то ячейка фокусируется, и редактирование начинается, в противном случае ячейка остается отключенной.

Я пытался использовать событие beforeedit, но пользователь может изменять значения с помощью клавиш со стрелками (так как редактор является числовым полем), даже когда отображается поле подтверждения, то есть, хотя щелчок мыши отключен, но клавиши со стрелками все еще могут изменять значение поля.

Кроме того, когда пользователь выбирает«Да», тогда ячейка теряет фокус, и я не могу начать редактирование сразу после нажатия «Да».Я пытался использовать метод «фокуса», но безуспешно.

Не могли бы вы помочь?

Заранее спасибо.

Дополнительная информация:

Iпопытался использовать - startEditByPosition () - функцию плагина редактирования ячейки, когда пользователь выбирает «Да».Но затем, из-за этого, окно подтверждения продолжает появляться снова, так как при выборе «Да» начинается редактирование, которое снова вызывает событие beforeedit.Любая помощь?

1 Ответ

16 голосов
/ 16 сентября 2011

Вы можете создать некоторую переменную флага, такую ​​как isEditAllowed. Проверьте это в beforeedit. Если это ложь, покажи confirm, иначе ничего не делай. Если пользователь подтверждает, установите isEditAllowed на true и startEditByPosition. В edit событии установите isEditAllowed в false:

        plugins: [
          Ext.create('Ext.grid.plugin.CellEditing', {
              clicksToEdit: 1,
            listeners: {
              'beforeedit': function(e) {
                var me = this;
                var allowed = !!me.isEditAllowed;
                if (!me.isEditAllowed)
                  Ext.Msg.confirm('confirm', 'Are you sure you want edit?', function(btn){
                    if (btn !== 'yes')
                      return;
                    me.isEditAllowed = true;
                    me.startEditByPosition({row: e.rowIdx, column: e.colIdx});
                  });
                return allowed;
              },
              'edit': function(e) {
                this.isEditAllowed = false;
              }
            }
          })
      ],

Вот демо.

...