PDA

View Full Version : form inside window gets submitted twice if i open the window twice



adeelmahmood
4 Sep 2012, 7:06 PM
I have a button that opens up a window by calling a function that simply uses

var wnd = Ext.create("SomeWindow", {});
return wnd;

to return a new window every time because there is a form inside the window which i want to reset everytime window is closed so it seems easier to just create a new window .. problem is the first time when the window opens i can submit the form in it just fine .. but if i open the window again and resubmit this time the form gets submitted twice .. if i open another time now form gets submitted 3 times .. so as many times i close and reopen window the form inside it gets submitted as many times
here is some code


Ext.define("IP.view.SavedSearchWnd", {
extend: 'Ext.window.Window',
alias: 'widget.savedsearchwnd',

title: 'Save Search',

initComponent: function(){
Ext.apply(this, {
layout: 'fit',
width: 320,
height: 190,
modal: true,
items: {
xtype: 'form',
url: saveSearchUrl,
...

//controller that creates the window has a function


//returns a new isntance of saved search window
getSavedSearchWindow: function(){
var win = Ext.create('IP.view.SavedSearchWnd', {});
return win;
},

vietits
4 Sep 2012, 7:26 PM
You should post more code about "IP.view.SavedSearchWnd" class, code of controller, code of submit form, etc.

dawesi
5 Sep 2012, 4:09 AM
there's two ways to clear a form;

1) reset - resets to values when form was created
2) clear - clears a form completely; this is done by loading a new model instance into the form.

closeAction: 'destroy' might also help with your issue.

adeelmahmood
5 Sep 2012, 6:02 AM
before trying to reset the form ill post my code to see whats the problem in it because closeAction by default is destroy and that should wipe out form as well ..


Ext.define("IP.view.SavedSearchWnd", {
extend: 'Ext.window.Window',
alias: 'widget.savedsearchwnd',

title: 'Save Search',

initComponent: function(){
Ext.apply(this, {
layout: 'fit',
width: 320,
height: 190,
modal: true,
items: {
xtype: 'form',
url: saveSearchUrl,
defaultType: 'textfield',
layout: {
type: 'vbox',
align: 'stretch'
},
border: false,
bodyPadding: 10,
fieldDefaults: {
labelAlign: 'top',
labelWidth: 100,
labelStyle: 'font-weight:bold'
},
defaults: {
margins: '0 0 10 0'
},
items: [
{
fieldLabel: 'Title',
name: 'searchTitle',
allowBlank: false
},
{
fieldLabel: 'Category',
name: 'searchCategory'
}
],
buttons: [
{
text: 'Save',
formBind: true,
disabled: true,
action: 'save'
},
{
text: 'Cancel',
action: 'cancel',
handler: function(){
this.up('window').hide();
}
}
]
}
});
this.callParent(arguments);
}
});




//first controller that handles the clicking of Save buttton

//saves the filter
onFilterSave: function(){
//invoke saved search controller
var searchController = this.getController('Searches');
searchController.init();
//get the saved search window from controller and show it
var savedSearchWindow = searchController.getSavedSearchWindow();
savedSearchWindow.show();
},




Ext.define("IP.controller.Searches", {
extend: "Ext.app.Controller",

requires: ['IP.view.SavedSearchWnd'],

refs: [
{
ref: 'savedSearchTree',
selector: 'savedsearchtree'
}
],

init: function(){
var self = this;
self.control({
'savedsearchwnd button[action="save"]': {
click: self.onSaveSearchSave
},
'savedsearchtree button[action="remove"]': {
click: self.onSearchRemove
},
'savedsearchtree button[action="removeAll"]': {
click: self.onSearchRemoveAll
}
});
},

//returns a new isntance of saved search window
getSavedSearchWindow: function(){
console.log(this.savedSearchWnd);
if(!this.savedSearchWnd){
console.log('creating new window');
this.savedSearchWnd = Ext.create('IP.view.SavedSearchWnd', {});
}
return this.savedSearchWnd;
},

//handles saving a search
onSaveSearchSave: function(obj){
var self = this;
var form = obj.up('form').getForm();
if(form.isValid()){
//disable the save button
obj.disable();
//sumit the form
form.submit({
params: {
action: 'add'
},
success: function(form, action){
obj.enable();
//close the window
obj.up('window').close();
//reload the searches store
self.getSavedSearchTree().getStore().reload();
},
failure: function(form, action){
Ext.Msg.alert('Failure', action.result.msg);
obj.enable();
}
});
}
}
});

vietits
5 Sep 2012, 5:03 PM
onFilterSave: function(){
//invoke saved search controller
var searchController = this.getController('Searches');
searchController.init(); // <- here is your problem
//get the saved search window from controller and show it
var savedSearchWindow = searchController.getSavedSearchWindow();
savedSearchWindow.show();
},

Your problem is that you call searchController.init() each time you open the savedSearchWindow. Each time init() method is called, controller will call its control() method to register to handle component events again while the previous registering handlers are still there. If you call init() ten times, your controller will register to handle events ten times and so on.
Below is my suggestion to fix your problem:


onFilterSave: function(){
//invoke saved search controller
var searchController = this.getController('Searches');
searchController.init();
searchController.init = Ext.emptyFn; // Make sure original searchController.init() is called one time.
//get the saved search window from controller and show it
var savedSearchWindow = searchController.getSavedSearchWindow();
savedSearchWindow.show();
},

giovannivl
20 Apr 2013, 7:23 PM
Your problem is that you call searchController.init() each time you open the savedSearchWindow. Each time init() method is called, controller will call its control() method to register to handle component events again while the previous registering handlers are still there. If you call init() ten times, your controller will register to handle events ten times and so on.
Below is my suggestion to fix your problem:


onFilterSave: function(){
//invoke saved search controller
var searchController = this.getController('Searches');
searchController.init();
searchController.init = Ext.emptyFn; // Make sure original searchController.init() is called one time.
//get the saved search window from controller and show it
var savedSearchWindow = searchController.getSavedSearchWindow();
savedSearchWindow.show();
},


:(On ExtJS 4.2 this soluction doesn't work for me, it's still fire button events twice, then i used on my controller.init() the button.on('click',function()) setting and now works ok, after close and re-open the window, is there another way to implement this "searchController.init = Ext.emptyFn" on 4.2?