Les appels aux fonctions ne fonctionnent pas

**MaPommeTao** · 15/08/2011, 17h50

Bonjour à toutes et à tous.

Je complète le titre tout d'abord en vous exposant mon problème.

Soit une page HTML "fabriquée" en grande part par du PHP, celle-ci comporte grosso modo des fioritures pour faire beau et une "div" contenant trois formulaires, l'un nommé "Devis", l'autre nommé "Client" et le troisième nommé "Envoi_commande".
Sur chaque formulaire :
- des boutons pour exécuter des ouvertures de fenêtres "popup", le résultat est Ok pour ceux là,
- d'autres pour valider des choix. Par exemple quand on a choisi une quantité, on clique sur un bouton "Valider" pour que suivant la quantité, le prix s'affiche dans la case qui va bien, ne fonctionne pas
- quand on clique sur "Commandez vos cartes", une vérification d'une case à cocher devrait être faite, si la case a été laissée tell que, une alerte, sinon on passe à la page suivante, ne fonctionne pas.

J'ai mes fonctions définies dans la section "<head>" de la page.

Si vous pouviez m'aider à trouver un embryon de réponse, ce serait bien sympathique. Ce doit probablement être trivial mais Javascript n'est pas mon langage maternel.

J'ai mis ma page générée en PHP par les choix précédemment fait sur la page précédente par l'utilisateur ici. J'ai ajouté un ordre "alert" dans la fonction qui calcule le prix, je ne la reçoit pas, donc je pense qu ela fonction n'est pas lancée.

Vous l'aurez deviné, je construit un site de vente de cartes.
Merci par avance.

**Willpower** · 15/08/2011, 18h49

cas 20 : Tarif_retenu = 33.00 ;
index.html:50Uncaught SyntaxError: Unexpected token :

Code :

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

1
2
3
4
5
6
7
8
9
10
      cas 30 : Tarif_retenu = 37.00 ;
                cas 40 : Tarif_retenu = 41.00 ;
                cas 50 : Tarif_retenu = 44.00 ;
                cas 60 : Tarif_retenu = 48.00 ;
                cas 70 : Tarif_retenu = 51.00 ;
                cas 80 : Tarif_retenu = 54.00 ;
                cas 90 : Tarif_retenu = 58.00 ;
                cas 100 : Tarif_retenu = 61.00 ;
                cas 150 : Tarif_retenu = 77.00 ;
                cas 200 : Tarif_retenu = 94.00 ;

"case" au lieu de "cas"

**MaPommeTao** · 15/08/2011, 18h59

Merci pour cette erreur que je n'avais pas vue !!

Cela suffisait-il à empêcher les autres fonctions de focntionner ?

Edit : J'ai rectifié cette erreur, cela ne fonctionne toujours pas !!!

**Willpower** · 15/08/2011, 19h05

Envoyé par MaPommeTao

Merci pour cette erreur que je n'avais pas vue !!

Cela suffisait-il à empêcher les autres fonctions de focntionner ?

Ca plante ton interpreteur de javascript en tout cas.
C'est l'erreur que google chrome m'affichait quand j'essayais d'afficher ta page, il existe peut-être d'autres erreurs. Une fois qu'il n'y aura plus d'erreurs de syntaxe, je commencerai à lire le code. :-)

**MaPommeTao** · 15/08/2011, 19h45

Je ne pensais pas que javascript était sensible à la casse, j'ai écrit aussi "switch" avec un grand "s" et ça non plus cela ne lui plait pas.

J'ai au moins cette fonction qui fonctionne à présent.

Je vais essayer de chercher pour les autres fonctions.

Merci déjà pour ce grand pas.

**MaPommeTao** · 15/08/2011, 21h21

J'ai été un peu vite.

J'ai modifié la fonction pour qu'elle accepte déjà de ne plus générer d'erreur.

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
 
	function calcul_prix(q)
	{
		n = parseInt(q);
		alert('Calcul avec :' + n);
		if (!isNaN(n))
		{
			switch (n) {
				case 20: 
					Tarif_retenu = 33.00 ;
					break;
				case 30: 
					Tarif_retenu = 37.00 ;
					break;
				case 40: 
					Tarif_retenu = 41.00 ;
					break;
				case 50: 
					Tarif_retenu = 44.00 ;
					break;
				case 60: 
					Tarif_retenu = 48.00 ;
					break;
				case 70: 
					Tarif_retenu = 51.00 ;
					break;
				case 80: 
					Tarif_retenu = 54.00 ;
					break;
				case 90: 
					Tarif_retenu = 58.00 ;
					break;
				case 100: 
					Tarif_retenu = 61.00 ;
					break;
				case 150: 
					Tarif_retenu = 77.00 ;
					break;
				case 200: 
					Tarif_retenu = 94.00 ;
					break;
				default: 
					Tarif_retenu = 94.00 ;
					break;
			}
			return(Tarif_retenu);
		}
	};

J'ai bien une alerte, mais avec '0' au premier clic et la valeur du choix précédent à chaque nouveau clic. C'est à dire que si je sélectionne 50, je vais obtenir la valeur précédente par exemple 30, il faut cliquer une deuxième fois pour obtenir 50. On dirait qu'il y a une désynchronisation des évènements.

Le bouton "Déjà inscrit ? " qui demande une adresse email fonctionne et l'affiche dans la case appropriée et le bouton "Vérifier" ouvre bien la fenêtre désirée.

Le bouton "Commandez vos cartes" ne fait rien.

N'existe-t-il pas un débogueur pour JavaScript ?

Je vais mettre des alert partout pour voir au moins si on entre dans les fonctions. On revient à la méthode des années 70.

**Willpower** · 15/08/2011, 23h30

A ma connaissance il n'existe pas de bon deboggeur (sinon je l'utiliserai) mais il existe malgré tout qqes outils je pense.

Pour debogger en général j'utilise la méthode ancestrale des alert (enfin des console.log sous chrome c'est plus propre) de façon dichotomique. Càd que si mon résultat final est faux, je divise mon code en 2 en checkant le résultat à mis parcours, s'il est bon, je vérifie après par la même méthode, s'il est déjà erroné, alors je recherche dans le code le précédent. Cette méthode est un peu effrayante mais en réalité rapide. (un temps logarithmique.)

Enfin, il m'est aussi arrivé de faire une petite fonction de debug (que je n'ai pas ici sous la main).

En gros l'idée etait de déclarer toutes mes fonctions dans un objet. (pour les rassembler facilement). ex :

Code :

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

1
2
3
4
var fn = {};
fn.faitCela = function(){...};
fn.ectFn = function(){...};
fn.blabla= function(){...};

Et d'ensuite les remplacer par une fonction surcharger qui les debugs du genre :

Code :

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

1
2
3
4
5
6
7
8
9
function debug(fn, name){
  return function(){
    console.log(name);
    return fn.apply(this,arguments);
  };
}
for(var i in fn)
  fn[i] = debug(fn,i);
// exécution du code ici après déclaration et surcharge des fonctions.

dans l'exemple ici, je log simplement le nom des fonctions lors de leurs appels, mais tu peux utiliser des try catch, logger leurs arguments ou leurs caller, ou en faire ce que tu veux pour débugger ton code plus facilement.

fait aussi attention de mon exemple si tu possèdes des fonctions servant de constructor, dans la surcharge tu devras alors checker si tu crées une nouvelle instance et si oui, faire un appel a "new fn".

**Willpower** · 15/08/2011, 23h34

un bon editeur de code t'aurais permis de voir directement ton erreur, même ce forum te la montre grace aux couleurs.

Code html :

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

<input onclick="checkCheckBoxAgree("Envoi_Commande")" />

sinon n'hésite pas à installer google chrome et à jeter un oeil dans la console d'erreurs. j'ai trouvé tes 2 erreurs comme ça.

(le message apparaît en cliquant sur le bouton qui "ne fonctionne pas")

bienvenue et bonne chance dans le monde effroyable du javascript.

**MaPommeTao** · 16/08/2011, 01h19

[QUOTE=Willpower;6183249]un bon editeur de code t'aurais permis de voir directement ton erreur, même ce forum te la montre grace aux couleurs.

Code html :

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

<input onclick="checkCheckBoxAgree("Envoi_Commande")" />

Merci Willpower de ton aide précieuse.
J'utilise Eclipse et Taco HTML Edit sur Mac, mais j'avais pas remarqué ces effets de couleurs sur les guillemets en trop. Je vais regarder ça de beaucoup plus prés.
Je vois bien les erreurs en PHP ou HTML avec l'habitude, mais je débute depuis 8 jours en Javascript et je suis allergique au C et C++, donc tu pourras comprendre mes difficultés.

J'ai découvert aujourd'hui un débogeur sur Safari dans le menu développement qui est facultatif. Il permet de mettre des points d'arrêt et d'examiner les valeurs des variables et il indique quelques fois les erreurs aussi.

Merci encore, je vais mettre les tutoriels de Javascript de ce site sur mon iPad pour avoir de la lecture dans les transports en commun.

**dukej** · 16/08/2011, 12h11

Envoyé par Willpower

A ma connaissance il n'existe pas de bon deboggeur (sinon je l'utiliserai) mais il existe malgré tout qqes outils je pense.

FAUX, cf la suite

Envoyé par Willpower

Pour debogger en général j'utilise la méthode ancestrale des alert (enfin des console.log sous chrome c'est plus propre) de façon dichotomique. Càd que si mon résultat final est faux, je divise mon code en 2 en checkant le résultat à mis parcours, s'il est bon, je vérifie après par la même méthode, s'il est déjà erroné, alors je recherche dans le code le précédent. Cette méthode est un peu effrayante mais en réalité rapide. (un temps logarithmique.)

C'est justement du développement à coup d'alert ou de console.log qui n'est pas la bonne manière.

Et pour débugger tu as tous les outils qu'il te faut :
Internet explorer : Internet Explorer Developer toolbar + Microsoft script debugger, qui permet de debugger en mettant des points d'arrêts, espionner les variables, faire du pas à pas
Firefox : Firebug : idem et même plus
Opera : Dragon Fly : Idem
Chrome / Safari : Webkit developper tools, tu peux aussi faire du debug pas à pas et compagnie.

Pour mettre un point d'arrêt sans te prendre la tête la manière la plus simple est d'utiliser le mot "debugger" dans le code :

Code :

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

1
2
3
4
 
// du code
debugger; //point d'arrêt.
// du code

**Willpower** · 16/08/2011, 13h33

Envoyé par dukej

FAUX, cf la suite

C'est justement du développement à coup d'alert ou de console.log qui n'est pas la bonne manière.

Et pour débugger tu as tous les outils qu'il te faut :
Internet explorer : Internet Explorer Developer toolbar + Microsoft script debugger, qui permet de debugger en mettant des points d'arrêts, espionner les variables, faire du pas à pas
Firefox : Firebug : idem et même plus
Opera : Dragon Fly : Idem
Chrome / Safari : Webkit developper tools, tu peux aussi faire du debug pas à pas et compagnie.

Pour mettre un point d'arrêt sans te prendre la tête la manière la plus simple est d'utiliser le mot "debugger" dans le code :

Code :

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

1
2
3
4
 
// du code
debugger; //point d'arrêt.
// du code

Ok pour le "faux".

Par contre ma technique (à coup de console.log ou autre) est extrêmement efficace et ce n'est pas mal de faire ainsi, chacun sa manière.

Etant donné que mes fonctions sont par défaut définies dans un objet ("fn") et que je les code relativement courtes. Il me suffit alors de rajouter mes 5 lignes de code entre la déclaration des fonctions et l'exécution du code pour débugger facilement et de façon personnalisé, rien de plus simple.

Evidemment, le "console.log" n'est pas indispensable, comme je l'ai dit, il suffit de personnaliser après, on peut utiliser des "try/catch" ou encore ton "debugger".

Bref, chacun trouve sa façon. On a ici donné tous les outils possible à "MaPommeTao".

**dukej** · 16/08/2011, 14h30

Envoyé par Willpower

Ok pour le "faux".

Par contre ma technique (à coup de console.log ou autre) est extrêmement efficace et ce n'est pas mal de faire ainsi, chacun sa manière.

Etant donné que mes fonctions sont par défaut définies dans un objet ("fn") et que je les code relativement courtes. Il me suffit alors de rajouter mes 5 lignes de code entre la déclaration des fonctions et l'exécution du code pour débugger facilement et de façon personnalisé, rien de plus simple.

Evidemment, le "console.log" n'est pas indispensable, comme je l'ai dit, il suffit de personnaliser après, on peut utiliser des "try/catch" ou encore ton "debugger".

Bref, chacun trouve sa façon. On a ici donné tous les outils possible à "MaPommeTao".

Pendant une journée, arrête de débugger avec un console.log et mets un point d'arrêt et admire le résultat.

Autre chose, quand tu as une erreur JS, tu peux faire forcer firefox à mettre un point d'arrêt sur l'erreur. Pour ça il suffit de cliquer sur le bouton qui ressemble à un bouton "pause" dans l'onglet "console", il se mettra à "clignoter".
Et à la première erreur il s'arrêtera. C'est utile pour débugger rapidement, efficacement et détecter les erreurs dans les try/catch.

Libre à toi de ne pas vouloir gagner en productivité

**MaPommeTao** · 16/08/2011, 23h33

Ne vous chamaillez pas les gars.

Il existe effectivement de outils pour deboguer.

N'utilisant Javascript que depuis à peine 15 jours car je ne peux pas faire autrement, je découvre les joies du "debug" en situation avec les outils qui vont avec les différents navigateurs.

J'ai pu ainsi tester les points d'arrêt, les affichages de valeurs et tout le reste.
Une erreur de syntaxe de PHP ou MySQL est plus facile à cerner, on récupère un message d'erreur immédiat sur la page Web. Je sais on prend de mauvaises habitudes avec le temps et les différents OS et langages qu'on utilise. (Fortran, Cobol, Pascal, Basic, Visual Basic, DCL, RPG, HTML, PHP, SQL, MySQL).
Des fois la tête est un peu encombrée.

Grace à vous deux, j'ai beaucoup avancé dans mon projet et un petit jeune me vient en soutien.

Difficile d'avoir 58 ans dans ce métier et de faire du multi-tâche.

Merci à vous deux.

P.S : Je développe sous Safari, accessoirement sous Firefox et si Internet Explorer tournait sous Mac, je m'y frotterai un peu, mais c'est pas le cas. merci MS.

Les appels aux fonctions ne fonctionnent pas

JavaScript

Discussions similaires

Partager

Partager