femeture d'une fenêtre par un bouton [Résolu]

[DiverSIG]

Bonjour,

je défini un composant hérité de Ext.window (en fait une fenêtre de connexion), avec 2 boutons 'Se connecter' et 'Annuler'.
Je n'arrive pas à affecter un evenement pour fermer la fenêtre lors d'un clic sur 'Annuler'...

voici mon code :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
Ext.onReady(function() {
	Ext.ns('Marel');
	Marel.wConnect = Ext.extend(Ext.Window, {
			initComponent : function() {
			var config = {
				id: 'wConnect'
				,itemId: 'wConnect'
				,width: 320
				,height: 130 
				,layout: 'fit' 
				,border: false 
				,frame: true 
				,title: 'Connexion' 
				,items: [{ 
					id: 'imginform-form' 
					,xtype: 'form' 
					,frame: true 
					,method: 'post' 
					,defaults: {anchor:'95%'} 
					,items: [{ 
						id: 'loginid'
						,xtype: 'textfield'
						,fieldLabel: 'Login'
						,allowBlank: false
						}
						,{ 
						id: 'passwordid'
						,xtype: 'textfield'
						,fieldLabel: 'Password'
						,inputType: 'password'
						,allowBlank: false
						} 
					]
				,buttonAlign: 'right' 
				,buttons: [
					{
					xtype: 'button'
					,text: 'Se connecter'
					,handler: function() {alert('connexion');}	// pour test
					},{
					xtype: 'button'
					,text: 'Annuler'
					,handler: function() {Ext.getCmp('wConnect').close();}
					}
				] 
				}]
				}	// fin config
 
 
			// apply config
			Ext.apply(this, Ext.apply(this.initialConfig, config));
 
			// call parent
			Marel.wConnect.superclass.initComponent.apply(this, arguments);
			this.show();
			}	// fin function initComponent
 
	}); 	// fin Marel.wConnect = Ext.extend(Ext.form.FormPanel
 
	Ext.reg('wConnect', Marel.wConnect);
});

quand je clique sur le bouton 'Annuler', firebug me renvoie une erreur :

Code :

Ext.getCmp("wConnect") is undefined

qu'est ce qui cloche ?

Merci,
Nico

[abraxis]

voici un système d'authentification qui fonctionne très bien (je ne sais plus ou je l'es trouvée ) et que j'utilise ^^

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
Ext.BLANK_IMAGE_URL = './ext/resources/images/default/s.gif';
 
Ext.onReady(function() {
 
	// var authCookie;
	var loginMD = new Ext.FormPanel(
		{
			//configuration formulaire login
			id:'loginMD',
			url: '', // Url de la page côté serveur
			baseParams: {task: 'auth'},
			frame:true,
			autoWidth: true, 
			autoHeight: true,
			labelAlign: 'right', //les labels s'aligneront a droite
			// method:'POST',
			items:[
				//champs login
				{
					xtype: 'textfield', // = champ de texte
					fieldLabel: 'Nom d\'utilisateur', // = label de description du champ
					id: 'login',    
					name: 'login',
					allowBlank: false, //champ obligatoire pour poster le formulaire
					blankText:'Veuillez saisir un login.' //message si le champ n'est pas rempli
				},{
				//champs password
					xtype:'textfield',
					fieldLabel: 'Mot de passe', // = label de description du champ
					id: 'pass',
					name: 'pass',
					allowBlank: false,
					inputType: 'password',
					blankText:'Veuillez saisir votre mot de passe.'
				},{
				//bouton connexion
					xtype: 'button',
					text: 'Connexion',
					handler: function(obj,event) {
						loginMD.getForm().submit( // Envoie du formulaire
							{ 
 
								method:'POST', 
								waitTitle:'Connection en cours', 
								waitMsg:'Envoi des données...',
								success:function(obj,result){  // Si l'authentification est OK ...
 
									Ext.Msg.alert('Statut', 'Identification réussie!', function(btn, text){
									 if (btn == 'ok'){
									win_login.hide(); // ...on cache la fenêtre d'auth
 
									window.location = 'application.html';
 
									},
 
								// Fonction d'échec, voir le commentaire ci-dessous
								// Comme vous pouvez le voir, si l'identification échoue il ouvre une boîte de dialogue
								// donnant Ã* l'utilisateur des détails sur l'échec.
								failure:function(form, action)
								{
									if(action.failureType == 'server'){ 
										obj = Ext.util.JSON.decode(action.response.responseText); 
										Ext.Msg.alert('Echec', 'Nom d\'utilisateur ou mot de passe non valide !');//, obj.errors.reason); 
									}
									else
									{ 
										Ext.Msg.alert('Attention!', 'Identification serveur injoignable : ' + action.response.responseText); 
									} 
									loginMD.getForm().reset(); 
								} 
							}
						); 
					}
				}
			]
		}
	);
 
	//creation de la boite de dialogue
  var win_login = new Ext.Window(
		{
			title:'Authentification',
			layout:'fit',
			autoWidth:true,
			autoHeight: true,        //hauteur de la fenêtre
			modal: true,             //Grise automatiquement le fond de la page
			plain: false,
			closable:false,
			draggable: false,
			resizable: false,
			border:true,
			items:loginMD
		}
	);
	win_login.show();
});

Tu trouvera dedans comment fermer la fenêtre

[DiverSIG]

Merci pour ta réponse.
j'ai trouvé aussi une solution en utilisant fireEvent :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
Ext.onReady(function() {
	Ext.ns('Marel');
	Marel.wConnect = Ext.extend(Ext.Window, {
			initComponent : function() {
			var config = {
				id: 'wConnect'
				,itemId: 'wConnect'
				,width: 320
				,height: 130 
				,layout: 'fit' 
				,border: false 
				,frame: true 
				,title: 'Connexion' 
				,items: [{ 
					id: 'imginform-form' 
					,xtype: 'form' 
					,frame: true 
					,method: 'post' 
					,defaults: {anchor:'95%'} 
					,items: [{ 
						id: 'loginid'
						,xtype: 'textfield'
						,fieldLabel: 'Login'
						,allowBlank: false
						}
						,{ 
						id: 'passwordid'
						,xtype: 'textfield'
						,fieldLabel: 'Password'
						,inputType: 'password'
						,allowBlank: false
						} 
					]
				,buttonAlign: 'right' 
				,buttons: [
					{
					xtype: 'button'
					,text: 'Se connecter'
					,handler: function() {alert('connexion');}	// pour test
					},{
					xtype: 'button'
					,text: 'Annuler'
					,bubbleEvents: ['closeWindow']
					,handler: function(){this.fireEvent('closeWindow');}
					}
				] 
				}]
				}	// fin config
 
 
			// apply config
			Ext.apply(this, Ext.apply(this.initialConfig, config));
 
			// call parent
			Marel.wConnect.superclass.initComponent.apply(this, arguments);
			this.show();
			}	// fin function initComponent
			,listeners: {
				closeWindow : function() {this.close();}
			}
 
	}); 	// fin Marel.wConnect = Ext.extend(Ext.form.FormPanel
 
 
 
	Ext.reg('wConnect', Marel.wConnect);
});

Nico