Захват формыPanel exit

Question

У нас есть панель формы, на которой размещена редактируемая сетка и кнопка «сохранить».

PROJ.RWA = Ext.extend(Ext.form.FormPanel, 
{ 

    initcomponent:function(){ 
.... 
..... 

var rwa_config = { 
     ....... 
     tbar:rwa_tbar, 
     items: [ 
      borr_grid, nonBorr_grid 
      ], 
     buttons: [{ 
       text: 'Save', 
       handler:this.getValues 
     }, 
     .....] 
     .......    
    }; 

    Ext.apply(this, Ext.apply(this.initialConfig, rwa_config)); 
    PROJ.RWA.superclass.initComponent.call(this, rwa_config); 
    } 

} 

Этот компонент загружается из index.html
Мы должны убедиться, что пользователь получает предупреждение, когда он навигации от этой панели, если имеются несохраненные изменения на сетках.
Если сетка «грязная» и «сохранить» еще не нажата - мы должны вывести предупреждение, когда пользователь переместится на другую страницу/панель.
Как мы это сделаем?

Answer 1

Вы можете добавить слушателя к событию beforedestroy или если он нормально закрыт, ознакомьтесь с beforeclose.

Это будет выглядеть примерно так:

listeners: { 
    beforedestroy: function(panel, eOpts){ 
     //check if there are unsaved changes (and show dialog or smoething) 
    } 
} 

Вы также можете return false; в «перед» -Event предотвратить фактическое действие.

Также посмотрите на beforedestroy doc.

Answer 2

Во-первых: Я думаю, что при нажатии кнопки «Save» вы вызываете операцию, которая возвращает успех: true. Затем все записи в магазине отмечены как «не грязные».

Итак, вам нужно будет только проверить, имеет ли сетка грязные записи.

В зависимости от конкретных способов, как вы можете "оставить" сетку, вы можете прослушивать один или несколько из следующих событий:

• beforeclose
• beforedestroy
• beforehide

В обработчике вы бы сделали так:

onGridExit:function(grid) { 
    if(grid.getStore().getUpdatedRecords().length>0) { 
     Ext.MessageBox.alert('Unsaved changes','Would you like to save your changes?',function() { 
      ... 
     }); 
     return false; 
    } 
}