IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Ext JS / Sencha Discussion :

femeture d'une fenêtre par un bouton


Sujet :

Ext JS / Sencha

  1. #1
    Membre habitué
    Profil pro
    Inscrit en
    Juillet 2005
    Messages
    434
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juillet 2005
    Messages : 434
    Points : 135
    Points
    135
    Par défaut femeture d'une fenêtre par un bouton
    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 : Sélectionner tout - Visualiser dans une fenêtre à part
    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 : Sélectionner tout - Visualiser dans une fenêtre à part
    Ext.getCmp("wConnect") is undefined
    qu'est ce qui cloche ?

    Merci,
    Nico

  2. #2
    Membre éclairé
    Avatar de abraxis
    Homme Profil pro
    Développeur Web
    Inscrit en
    Mai 2007
    Messages
    439
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Mai 2007
    Messages : 439
    Points : 658
    Points
    658
    Par défaut
    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 : Sélectionner tout - Visualiser dans une fenêtre à part
    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
    # apt-get install freedom

  3. #3
    Membre habitué
    Profil pro
    Inscrit en
    Juillet 2005
    Messages
    434
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juillet 2005
    Messages : 434
    Points : 135
    Points
    135
    Par défaut
    Merci pour ta réponse.
    j'ai trouvé aussi une solution en utilisant fireEvent :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    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

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. ouvrir une deuxieme fenêtre par un bouton
    Par totooo dans le forum Interfaces Graphiques en Java
    Réponses: 2
    Dernier message: 28/02/2009, 22h30
  2. [C#]Restaurer une fenêtre par programmation
    Par SLE dans le forum Windows Forms
    Réponses: 4
    Dernier message: 09/06/2006, 23h40
  3. [JFrame] Placer une fenêtre par rapport à une autre
    Par Invité dans le forum Agents de placement/Fenêtres
    Réponses: 7
    Dernier message: 16/09/2005, 16h47
  4. Generer une boite de confirmation lors de la femeture d'une fenêtre
    Par BernardT dans le forum Agents de placement/Fenêtres
    Réponses: 2
    Dernier message: 18/07/2005, 13h51
  5. Réponses: 1
    Dernier message: 16/02/2005, 12h04

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo