Discussion :

[jeffray03]

bonjour tout le monde,

j´ai un petit souci

je ne comprend vraiment rien, j´ ai une page php ayant du html, et un fichier javascript, quand j´appuie sur le button chercher, cela ne me renvoi pas a la page concerner, pourtant les autres marche impeccablement
voici les concernés :

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
 
la function javascript 
function fSuche(sTable,sAction)
{
        showLoading();
        url = 'Lib/ProzessSuche.php';
        target = 'fuss';
        $('fuss').style.display = '';
        if(sAction =='')
        {
          $('fSuchen').reset();
        }
        pars = Form.serialize('fSuchen');
 
        pars +='&tbl='+sTable;
        myAjax = new Ajax.Updater(target, url, {method: 'get', parameters: pars});
 
        sTabelle =sTable;
        url = './datagrid3/example_oracle.php';
 
        target = 'inhalt';
        pars = Form.serialize('fSuchen');
 
        pars +='&tbl='+sTabelle;
 
        myAjax = new Ajax.Updater(target, url, {method: 'get', parameters: pars});       
 
}
 
 
function showLoading()
{
  $('inhalt').innerHTML ="<center><font style='font-size=12px;'>Données en cours de telechargement ...</font><img src='../Images/common/loading.gif'></center>";
}
 
 
document html permettant d´envoyer la requete a la function fSuche(sTable,sAction): 
 
<div id ='suche2' style="position:absolute; left:0px; top:0px;  border:0px; ">
   <form method="post" name="fSuchen" id ="fSuchen">
     <fieldset class='blue_class_legend' style=" width:200px; height:140px;  border:0px; " >
       <legend>
	     <font color='blue'>
		   SUCHE
		 </font>
       </legend>
	   <table border=0 align='center' width='200px'  > 
         <tbody>
           <tr valign="middle">
		     <td>&nbsp;</td>
			 <td> 
			   <select class="blue_class_select" name="blindsucheOperator" id="blindsucheOperator">
			     <option value="=">egal</option>
				 <option value="&gt;=">plus grand que</option>
				 <option value="&lt;">plus petit que</option>
				 <option value="like">exactement</option>
				 <option value="like%">commence avec</option>
				 <option value="%like">finit avec</option>
				 <option value="%like%">contient</option>
				 <option value="not like">ne contient pas</option>
			  </select>
		    </td>
           <td align="rigth" width="50%">
             <input class="blue_class_textbox" size=6 value="" name="blindsucheOperatortext" id="blindsucheOperatortext" type="text">
		   </td>
		   <td colspan="5" align="center">
		     <input class="blue_class_button" name="SUBMIT_FILTER" id="SUBMIT_FILTER" value="chercher" type="submit" onclick="fSuche('KATASTER','suche'); return false;">&nbsp;
		     <input class="blue_class_button" name="SUBMIT_RESET" id="SUBMIT_RESET" value="annuller" accesskey="13" type="button" onclick="fSuche('KATASTER','');return false;">
		   </td>
         </tr>
         <tr>
		   <td colspan="5" style="font-size:10px;" color='black' align="center" height="6">
		   </td>
		 </tr>
	   </tbody>
	 </table>
   </fieldset>
 </form>
</DIV>
 
<div id="inhalt"> </div>

je ne comprend vraiment rien.
de plus avant cela marchait impeccablement, maintenant seul le

Code :

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

1
2
 
Showloading();

marche mais il n´arrive pas dans la 2eme requete ajax.updater();
quelqu´un a-t - il une idée. pourquoi le loading n´est pas remplacé par la seconde requete.

Merci d´avance

[marcha]

La variable Form n'est pas déclarée dans ton exemple, l'est-elle en global
ou est-ce que tu voulais écrire plutot:

Code :

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

1
2
 
        pars = $('fSuchen').serialize();

[jeffray03]

non elle est bien declare, c´est la balise du formulaire:

Code :

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

1
2
3
 
 <form method="post" name="fSuchen" id ="fSuchen">
</form>

si tu regardes bien mon code, c´est elle qui entoure les balises <input>,

[marcha]

ce que tu montre là est un fragment html, rien à voir avec
une déclaration de variable javascript.

[jeffray03]

avec le prototype que j´utilise, quand tu fais :

Code :

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

1
2
 
Form.serialise("le_nom_de_ton_formulaire");

'Form' veux tout simplement dire que c´est un formulaire c´est pour cela que j´ai fait allusion a cela.

[marcha]

ok désolé j'ai plus utilisé prototype depuis quelques temps

Bon alors pour ton problème:

Le formulaire est posté, il provoque un rechargement de ta page.

tu as utilisé un return false dans le onclick de ton bouton, ce qui
évite en effet le traitement par défaut du click.

mais comme ton bouton est de type submit, cela produit un autre
évènement qui lui n'est pas désactivé.

tu peux par exemple mettre un onsubmit="return false;" dans ta
balise form pour corriger le problème.

mais il serait plus judicieux de mettre directement
onsubmit="fSuche('KATASTER','suche'); return false;" dans ta balise
form et oublier la gestion du onclick sur ce bouton.

D'autre part, tu pourrais aussi éviter les évènements DOM0 en assignant
tes évènements avec Event.observe qui a l'avantage d'autoriser un
éventuel chainage, qui permet une meilleure séparation du code html/js
et qui permet aussi d'utiliser Event.stop pour gérer les évènement qui
ne doivent pas 'continuer'

un exemple:

Code :

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

1
2
3
4
5
6
7
8
 
Event.observe(window, 'load', function() {
  Event.observe("fSuchen", 'submit', function(event) {
    Event.stop(event); // ou event.stop() dans les dernières versions de prototype
    ... ton code ici
  });
 
});

[jeffray03]

le probleme, c´est que quand je l´appelle avec des données, elle se plante carrement, et le ajax.updater() n´est pas executer.
le browser plante. et il ne m´affiche aucune erreur.

[GoTrUnKo]

Bonsoir,
Je n'ai jamais utilisé de Framework ou autre pour faire de l'ajax, je ne connais guère ces méthodes, mais il serait préférable dans ton code de Déclarer les variables, lorsque je vois :

Code :

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

1
2
url = 'Lib/ProzessSuche.php';
target = 'fuss';

Je me dis surtout qu'il y a encore pas mal de navigateur qui ne vont pas l'interpréter, pourquoi ? car ceci n'est pas logiquement correct,

Code :

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

1
2
var url = 'Lib/ProzessSuche.php';
var target = 'fuss';

Pour vous dire, j'ai cherché pendant longtemps pourquoi mon code marché sous IE et pas sous FF (ou le contraire) avant de comprendre qu'il fallait que je déclare mes variables.



Sinon j'aimerai au passage en apprendre plus, pourquoi mettre :

Code :

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

  $('inhalt').innerHTML ="....";

Au lieu de

Code :

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

document.getElementById("inhalt").innerHTML

Pour essayer de choper les erreurs, utilise FireBug, que je conseil à beaucoup de gens, si tu ne l'as pas déjà, c'est un module complémentaire de firefox, celui-ci t'indiquera les données envoyer, et ce que tu as reçus au passage ainsi que d'autres informations très utiles.

GoT

[jeffray03]

salut ,

Code :

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

1
2
 
 $('inhalt').innerHTML ="....";

et

Code :

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

1
2
 
 document.getElementById("inhalt").innerHTML = ".....";

c´est du pareil au meme, sauf que l´autre passe par le prototype et l´autre non.
sinon j´ai pris note et firebug est deja installé, mais je ne comprend pas pourquoi cela peut faire planter mon browser.

[marcha]

le probleme, c´est que quand je l´appelle avec des données, elle se plante carrement, et le ajax.updater() n´est pas executer.
le browser plante. et il ne m´affiche aucune erreur.

Regarde ce que tu trouves dans l'onglet Net de firebug, tu dois voir la requête
d'envoi du formulaire et pouvoir étudier les paramètres passés ainsi que le
réponse du serveur.

[marcha]

Pour vous dire, j'ai cherché pendant longtemps pourquoi mon code marché sous IE et pas sous FF (ou le contraire) avant de comprendre qu'il fallait que je déclare mes variables.

La déclaration des variables est optionnelle en javascript, par contre
les variables déclarées se comportent différemment suivant le contexte,
un exemple:

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
 
b = 15; // déclaration optionnelle ici, mais c'est plus rigoureux d'écrire var b = 15;
 
function toto() {
  var b = 12; // déclare une autre variable b, locale à la fonction
  alert(b);
}
 
function titi() {
  b = 7; // modifie la variable b globale (la crée dans l'espace global si celle-ci n'existe pas)
  alert(b);
}
 
toto();
titi();
alert(b);

Résultat, 12, 7, 7

En résumé:

Déclare toujours tes variables dans tes fonctions, sauf si
tu veux utiliser une variable de l'espace global.