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 :

Divers boutons de menu


Sujet :

Ext JS / Sencha

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éprouvé
    Avatar de Emyleen
    Femme Profil pro
    Webmaster
    Inscrit en
    Mars 2010
    Messages
    150
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Âge : 39
    Localisation : France, Aveyron (Midi Pyrénées)

    Informations professionnelles :
    Activité : Webmaster
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Mars 2010
    Messages : 150
    Par défaut Divers boutons de menu
    Bonjour!

    Je suis débutante en ExtJS et je cherche a rendre fonctionnel les boutons d'un menu que voici :

    Code JavaScript : 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
     
    CreateTopPanel: function() {
     
            var config = {
                border: false
    			, layout: { type: 'hbox', align: 'stretch' }
                , id : 'menu'
                //, flex: 1
    			, xtype: 'toolbar'
    			,items: [
    				{
    					xtype: 'button',
    					id: 'deconnexion',
    					text: '',
    					cls: 'butonClasse',
    					handler: function(){
    						alert("deconnexion");
    					}
    				},
    				{
    					xtype: 'button',
    					id: 'print',
    					text: '',
    					cls: 'butonClasse',
    					handler: function(){
    						alert("Impression");
    					}
    				},
    				{
    					xtype: 'button',
    					id: 'sendMail',
    					text: '✉',
    					cls: 'butonClasse',
    					handler: function(){
    						alert("Envoyer un Mail");
    					}
    				},
    				{
    					xtype: 'button',
    					id: 'share',
    					text: '',
    					cls: 'butonClasse',
    					handler: function(){
    						alert("Partager");
    					}
    				},
    				{
    					xtype: 'button',
    					id: 'addFavorites',
    					text: '★',
    					cls: 'butonClasse',
    					handler: function(){
    						alert("Ajouter aux favoris");
    					}
    				}
    			]
            };
            //config.items = items;
     
            return Ext.create('widget.panel', config);
        }

    Comme vous pouvez le voir, pour l'instant je ne fais que des alert (car je ne sais faire que ça). Je voudrais savoir si vous aviez des scripts qui me permettraient de faire les actions suivantes :
    - Lancer une impression écran
    - Ajouter une div dans le dom et l'ouvrir façon show de jQuery
    - Envoyer un mail via une adresse saisie
    - Ajouter la page à mes favoris

    Merci d'avance pour vos pistes!

  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 : 48
    Localisation : France

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

    Informations forums :
    Inscription : Mai 2007
    Messages : 439
    Par défaut
    Bonsoir,

    Rien n'empêche d'utiliser jQuery avec ExtJS
    Il existe plusieurs sites qui proposent des plug-in pour divers actions.

  3. #3
    Rédacteur

    Avatar de Bovino
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2008
    Messages
    23 647
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 54
    Localisation : France, Gironde (Aquitaine)

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

    Informations forums :
    Inscription : Juin 2008
    Messages : 23 647
    Billets dans le blog
    20
    Par défaut
    - Lancer une impression écran
    Non, cela n'est pas possible en JavaScript (ExtJS et jQuery ne sont que du JavaScript).
    - Ajouter une div dans le dom et l'ouvrir façon show de jQuery
    Oui, c'est faisable (sans être obligé de passer par jQuery : inutile d'ajouter un framework pour ça...), voir Ext.fx.Anim View.
    - Envoyer un mail via une adresse saisie
    Il est uniquement possible en JavaScript d'ouvrir le logiciel de messagerie, pas d'envoyer un mail.
    - Ajouter la page à mes favoris
    C'est possible, mais pas de façon cross-browser...
    Pas de question technique par MP !
    Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi !
    Mes formations video2brain : La formation complète sur JavaScriptJavaScript et le DOM par la pratiquePHP 5 et MySQL : les fondamentaux
    Mon livre sur jQuery
    Module Firefox / Chrome d'intégration de JSFiddle et CodePen sur le forum

  4. #4
    Expert confirmé
    Avatar de sekaijin
    Homme Profil pro
    Urbaniste
    Inscrit en
    Juillet 2004
    Messages
    4 205
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 61
    Localisation : France, Yvelines (Île de France)

    Informations professionnelles :
    Activité : Urbaniste
    Secteur : Santé

    Informations forums :
    Inscription : Juillet 2004
    Messages : 4 205
    Par défaut
    je te conseille de regarder de près les examples de sencha
    plus précisément celui-ci toolbar menu et surtout action menu

    passer par une action permet de séparer le design du fonctionnel
    une même action pouvant être activé par plusieurs widget différents

    pour ce qui est d'ajouter des élement dans le DOm rien de plus simple
    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
    var dh = Ext.DomHelper; // create shorthand alias
    // specification object
    var spec = {
        id: 'my-ul',
        tag: 'ul',
        cls: 'my-list',
        // append children after creating
        children: [     // may also specify 'cn' instead of 'children'
            {tag: 'li', id: 'item0', html: 'List Item 0'},
            {tag: 'li', id: 'item1', html: 'List Item 1'},
            {tag: 'li', id: 'item2', html: 'List Item 2'}
        ]
    };
    var list = dh.append(
        'my-div', // the context element 'my-div' can either be the id or the actual node
        spec      // the specification object
    );
    la doc est dans DomHelper

    mais mieux que des élément du DOM extjs te permet d'ajouter n'importe quel composants (conteneur, vue, form etc)
    pour les adeptes des templates
    xtemplate (tres comples mais un peu lourd) ou template (plus léger mais moins complet) permet d'afficher des données formatés dans n'omporte quel endroit du DOM
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    var data = {
        name: 'Don Griffin',
        title: 'Senior Technomage',
        company: 'Sencha Inc.',
        drinks: ['Coffee', 'Water', 'More Coffee'],
        kids: [
            { name: 'Aubrey',  age: 17 },
            { name: 'Joshua',  age: 13 },
            { name: 'Cale',    age: 10 },
            { name: 'Nikol',   age: 5 },
            { name: 'Solomon', age: 0 }
        ]
    };
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    var tpl = new Ext.XTemplate(
        '<p>Name: {name}</p>',
        '<p>Title: {title}</p>',
        '<p>Company: {company}</p>',
        '<p>Kids: ',
        '<tpl for="kids">',     // interrogate the kids property within the data
            '<p>{name}</p>',
        '</tpl></p>'
    );
    tpl.overwrite(panel.body, data);  // pass the root node of the data object
    la encore la doc est très complète.

    A+JYT

Discussions similaires

  1. bouton avec menu déroulant dans la tool bar.
    Par archerhawke dans le forum AWT/Swing
    Réponses: 3
    Dernier message: 27/10/2009, 19h50
  2. [Problème] bouton dans menu jump and down
    Par Sandro7 dans le forum Flash
    Réponses: 1
    Dernier message: 25/10/2006, 20h19
  3. [FLASH 8] Transition sur bouton de menu deroulant
    Par chienlou dans le forum Flash
    Réponses: 3
    Dernier message: 05/06/2006, 10h13
  4. Problème avec Goto pour un bouton de menu
    Par Klotian dans le forum Flash
    Réponses: 3
    Dernier message: 26/05/2006, 17h49
  5. Réponses: 3
    Dernier message: 13/06/2005, 12h05

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