Discussion :

[Invité]

Bonjour,

J'utilise les bibliothèques Prototype et Prototype Window. Je suis confronté au problème suivant :
J'ai une Window qui affiche un formulaire. Je voudrais fermer la fenêtre et récupérer la valeur des champs de se formulaire lorsque l'utilisateur cliqueras sur le bouton submit du formulaire.

1° - Comment fermer la fenêtre lorsque l'utilisateur clique sur le bouton submit ?
2° - Comment récupérer la valeur d'un champ contenu dans la fenêtre ?


Merci.


PS : Je ne trouve pas beaucoup de documentation sur Prototype et Prototype Window autres que les API (qui ne sont pas l'idéal pour débuter). Avez-vous quelques bonnes urls ?

Merci

[SpaceFrog]

C'est une fausse fenetre ( un div en fait )... le champs est sur la page, donc fait comme pour un formulaire qui serait sur la même page

pour le fermeture de la fenetre faut lancer un .close()

[RomainVALERI]

Si ma mémoire est bonne, pour accéder à n'importe quel élément de la page avec Prototype, tu fais

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var tonElement = $('tonElement');

et il te renvoie un élément étendu.

"tonElement" étant en fait soit l'id soit l'élément lui-même (enfin sa référence) au choix.

[Invité]

Merci pour vos réponses.

Mais si le contenu de mon formulaire est obtenu par une URL ou une requête Ajax, celà peut-il également fonctionner ?

Pour le récupération des champs, je suppose que oui. Mais pour la fermeture de la fenêtre, je ne vois pas comment provoquer la fermeture dans le cas ou le contenu (pas sur le même page) 0n'auras pas de référence à la fenêtre.

[SpaceFrog]

marrant ça ...
puisqu'on te dit que c'est sur la même page ... (même si la réponse provient d'une url)

sauf si tu as mis un iframe dans ta reponse ajax ...

[Invité]

Après avoir testé je n'y parviens toujours pas.

Mon code est le suivant :

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
function add() {
        win = new Window({
            title: "Test", 
            width:600, 
            height:450, 
            destroyOnClose: false, 
            maximizable: false,
            minimizable : false,
            recenterAuto: false,
            onClose: addColumns
            });   
	win.setURL('/forms/addColumn.html');
        win.show();                    
    }
 
    function addColumns() {
    	var form = $('addColumnForm');
    	var title = $F(form['title']);
    	var max = $F(form['maximum']);
    	if (title=="" || max=="")
    		return;
 
    	var items;
 
    	for ( var i=0; i<(items = $$('#cotations thead tr th.blank')).length; i++ ) {
    		var column = new Element('th');
    		if ( i==0 ) 
    			column.update(title);
    		else
    			column.update('/'+max);
    		items[i].insert( {before : column} );
    	}
    	for ( var i=0; i<(items = $$('#cotations tbody tr td.blank')).length; i++) {
    		var column = new Element('td').insert(new Element('input', {'type':'text', 'size':'2', 'maxlength':'3'}));
    		items[i].insert( {before : column} );
    	}
    }

Et le contenu de la page /forms/addColumn.html :

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
 
<form id="addColumnForm">
		<table>
		<tr>
			<td><label for="title">???label.Title???</label></td>
			<td><input type="text" name="title" id="title"/></td>
 
		</tr>
		<tr>
			<td><label for="maximum">???label.Maximum???</label></td>
			<td><input type="text" name="maximum" id="maximum" size="3" /></td>
		</tr>
		<tr>
			<td coslpan="2">
				<input type="reset" value="Cancel" />
 
				<input type=button value="Save" onclick="close();"/>
			</td>
		</tr>
</form>

Merci pour votre aide