[POO] script popup

Version imprimable

[POO] script popup

Bonjour,
J'ai ci-dessous un script permettant d'ouvrir une fenêtre dans la page courante :
http://iwooz.com/script-espace-membre%203/Image%201.png

j'aimerais pouvoir ajouter une autre image qui ouvre une deuxième popup j'ai testé de récrire la même "phrase" mais seul la première des 2 images ouvre une popup.

voici le script:

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
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Hello World Window Example</title>
    <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
 
    <!-- GC -->
 	<!-- LIBS -->
 	<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
 	<!-- ENDLIBS -->
 
    <script type="text/javascript" src="../../ext-all.js"></script>
 
    <script language="javascript" src="hello.js"></script>
 
<!-- Common Styles for the examples -->
<link rel="stylesheet" type="text/css" href="../examples.css" />
 
    <style type="text/css">
    .x-panel-body p {
        margin:10px;
        font-size:12px;
    }
    </style>
</head>
<body>
<script type="text/javascript" src="../examples.js"></script><!-- EXAMPLES -->
 
<h1>Hello World Window</h1>
<p>This example shows how to create a very simple modal Window with "autoTabs" from existing markup.</p>
<input type="image" id="show-btn" "src="http://s255859051.onlinehome.fr/script-espace-membre%203/zone-membre/mangas-0022.gif" />
<p>Note that the js is not minified so it is readable. See <a href="hello.js">hellos.js</a> for the full source code.</p>
 
<div id="hello-win" class="x-hidden">
    <div class="x-window-header">Hello Dialog</div>
    <div id="hello-tabs">
        <!-- Auto create tab 1 -->
        <div class="x-tab" title="Hello World 1">
            <p>Hello...</p>
        </div>
        <!-- Auto create tab 2 -->
        <div class="x-tab" title="Hello World 2">
            <p>... World!</p>
        </div>
    </div>
</div>
</div>
</body>
 
</html>

merci,

21/01/2009, 11h23
Auteur

bonjour,

que contient hello.js ?

Je sais pas si ça peut aider mais voila "hello.js"

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
/*
 * Ext JS Library 2.0.2
 * Copyright(c) 2006-2008, Ext JS, LLC.
 * <a href="mailto:licensing@extjs.com">licensing@extjs.com</a>
 * 
 * <a href="http://extjs.com/license" target="_blank">http://extjs.com/license</a>
 */
 
Ext.onReady(function(){
    var win;
    var button = Ext.get('show-btn');
 
    button.on('click', function(){
        // create the window on the first click and reuse on subsequent clicks
        if(!win){
            win = new Ext.Window({
                el:'hello-win',
                layout:'fit',
                width:500,
                height:300,
                closeAction:'hide',
                plain: true,
 
                items: new Ext.TabPanel({
                    el: 'hello-tabs',
                    autoTabs:true,
                    activeTab:0,
                    deferredRender:false,
                    border:false
                }),
 
                buttons: [{
                    text:'Submit',
                    disabled:true
                },{
                    text: 'Close',
                    handler: function(){
                        win.hide();
                    }
                }]
            });
        }
        win.show(this);
    });
});

merci,

visiblement ta pop-up est un div :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 <div id="hello-win" class="x-hidden"> <div class="x-window-header">Hello Dialog</div> <div id="hello-tabs">  <div class="x-tab" title="Hello World 1"> <p>Hello...</p> </div>  <div class="x-tab" title="Hello World 2"> <p>... World!</p> </div> </div> </div>
qui a pour id="hello-win". D'après ce que je vois dans le fichier JS que tu as posté
Code:

1 2 3 4 5 6 7 8 9 if(!win){ win = new Ext.Window({ el:'hello-win', layout:'fit', width:500, height:300, closeAction:'hide', plain: true,
ton objet Ext est lié à ce div. Donc, pour pourvoir ouvrir une nouvelle pop-up, il faut créer un nouvel objet Ext lié à un autre div (qui aura forcément un id différent de "hello-win").

Regarde la documentation des fichiers : ext-base.js et ext-all.js sur le site de celui qui a conçu cette bibliothèque.

22/01/2009, 10h30
EIN-LESER

Dis toi de toute façon que peux importe ce que tu crée (box, texfield ou n'importe quoi d'autre) une ID est toujours unique sur une page. ;)
22/01/2009, 10h41
Auteur

Citation:

Envoyé par EIN-LESER

Dis toi de toute façon que peux importe ce que tu crée (box, texfield ou n'importe quoi d'autre) une ID est toujours unique sur une page. ;)

oui, mais c'est toujours bon de le rappeler :mrgreen:
22/01/2009, 11h08
EIN-LESER

Les bases sont toujours importantes a rappeler :mouarf:

Et puis je sais pas pour vous mais moi c'est sur ce genre de petites bêtises que j'ai tendance a perdre la plus de temps dans mes prog :aie: