Methodologie sur javascript

**Arnard** · 06/11/2006, 18h10

Bonjour, je bosse actuellemnt sur un projet J2EE, et il est prevu d'utiliser JavaScript pour aporter davantage de confort à l'utilisateur. Sachant qu'il va y avoir plusieurs formulaires à checker, cela va entrainer l'ecriture de nombreuses fonctions, la question est donc de savoir comment regrouper ces methodes, s'assurer qu'un code est deja ecrit, afin d'eviter de reecrire des fonctions, en bref des regles de methodologie afin d'optimiser le travail sur jscript

Merci d'avance

**FremyCompany** · 06/11/2006, 18h27

Je te propose d'utiliser un sytsthème de progammation proche de Java dans ce cas (classe, espace de noms, ...)

Classe de donnée :

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
// Constructeur
MyClass = function (args) {
   // Membres d'instance
   this.field01=0; this.field02="Any text";
}
 
// Membres statiques (je connais pas le terme JAVA)
MyClass.staticField="staticValue";
// Fonctions statiques
MyClass.equals=function (o1, o2) {
   return o1.field01 == o2.field01;
}
 
// Fonctions d'instance
MyClass.prototype.getField01=function() { return this.field01; )

Espaces de noms :

Code :

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

1
2
3
4
5
6
7
namespace1 = {
   Class01 : function() {},
   Class02 : function() {}
}
 
//Fonctions des classes
namespace1.Class01.prototype.func : function() {}

Ajouter des méthodes à un objet 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
/*namespace*/ HTML = {
   InputAddinClass : function() {
   }
}
 
// Fonctions des classes
HTML.InputAddinClass.prototype.changeText=function(txt) {
      this.value=txt;
}
HTML.InputAddinClass.prototype.onchange=function() { /**/ }
 
var input=document.createElement("input");
input.addIn=new HTML.InputAddinClass();
for (key in input.addIn) {
    input[key]=input.addIn[key];
}

**Arnard** · 07/11/2006, 13h33

Je ne connais pas les deux derniers elements, je vais donc approfondir cela. Merci beaucoup

**Arnard** · 16/11/2006, 12h02

Apparement pour affecter des actions sur un objet HTML, il faut d'abord écrire son formulaire, puis la couche javascript. N'y a t-il pas moyen de regrouper le javascript dans le head avec les includes habituels ?

Merci

**Matthieu2000** · 16/11/2006, 14h08

http://javascript.developpez.com/faq/?page=syntaxe#js

**Arnard** · 16/11/2006, 15h22

Quand je parle des includes habituels, je parlais du <script type="text/javascript" src="mon_fichier_script.js"></script> VU que si le code JS etait avant le form cela ne marchait, j'imanginais que si je le mettais simplement en <script src....> cela n'allait rien changer

Décidant de tester quand meme, je me retrouve avec ce code et quelques soucis :

Mon fichier HTML actuel :

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
<html>
<head>
	<script type="text/javascript" src="test.js"></script>
</head>
<body>
<form name="truc" id="form">
 
<input type="text" name="toto" id="toto" tailleMin=1>
<input type="text" name="titi" id="titi" tailleMin=5>
<input type="text" name="tata" id="titi">
<input type="submit" value="envoyer" id="submit" name="bouton d'envoi">
 
<script language="JavaScript">
 
var envoi=document.getElementById("submit");
 
envoi.addIn=new HTML.checkClass ();
for (key in envoi.addIn) {
    envoi[key]=envoi.addIn[key];	
}
 
</script>	
</form>
</body>
</html>

Mon fichier JS actuel :

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
/*namespace*/ 
HTML = {
  checkClass : function() {
  }	
}
 
// Fonctions des classes
 
HTML.checkClass.prototype.verifierTailleMin=function(texte, tailleMin)
{ 
	return texte.length < tailleMin ? false : true;
}
 
HTML.checkClass.prototype.onclick=function() 
{ 
	var formOK = true;
 
	/*this.value=HTML.checkClass.prototype.changeText(this.value);*/ 
	var input =document.getElementsByTagName("input");
 
	for(var i=0; i < input.length; i++)
	{	
		if(input[i].type == "text")
		{	alert(HTML.checkClass.prototype.verifierTailleMin(input[i].value, input[i].tailleMin));
			if(!HTML.checkClass.prototype.verifierTailleMin(input[i].value, input[i].tailleMin))
			{
				formOK = false;
			}
		}
	}
	alert(formOK);
	return formOK;
}

Mon souci : Je dois laisser un morceau de code dans le HTML (var envoi=...), sinon envoi est considéré comme dépouvu de properties...

Je n'arrive pas à récupérer l'attribut tailleMin avac ma fonction dans le fichier js, alors que lorsque mon script javascript est avec mon HTML cela ne pose pas de souci :/

Merci d'avance ^^

**Arnard** · 16/11/2006, 17h16

Bon, je sais pas pourquoi, mais j'arrive à récuperer ma valeur tailleMin maintenant.... Allez comprendre

Sinon, toujours ma derniere question, on est obligé de rajouter

Code :

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

1
2
3
4
5
6
var envoi=document.getElementById("submit");
 
envoi.addIn=new HTML.checkClass ();
for (key in envoi.addIn) {
    envoi[key]=envoi.addIn[key];	
}

Sinob c'est erreur objet envoi null patati patata.... Ou alors définir l'appel du fichier js apres le formulaire plutot que dans le head. j'aimerai pourtant regrouper toutes mes pages js dans une meme page incluse, histoire de moins se prendre la tete sur le nombre de modification à faire ulterieurement, meme si ca reste encore faible ^^

Methodologie sur javascript

JavaScript

Discussions similaires

Partager

Partager