Discussion :

[StryceK]

Bonjour,

Je débute plus au moins dans le dev WEB et c'est pour cela que j'aurai besoin de vous pour me résoudre un problème.

Je souhaite faire une grosse fonction qui permet de vérifier un formulaire. Pour cela, je souhaite encapsuler plusieurs fonctions dans une grosse, mais en vain ..
Pourtant quand j'appelle mes fonctions une à une, cela fonctionne..

Code JS :

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
function checkCategories(){
  function checkSlug(slug){
    var patt=new RegExpSlug(/^[a-z\-0-9]+$/);
 
    if (document.formAjouter_Categorie.slug.value.length == 0){
      alertify.alert("Le champ nom doit être renseigné");
      return false;
    }
    if(document.formAjouter_Categorie.slug.value == (/^[a-z\-0-9]+$/)){
      alertify.alert("Le slug est incorrect");
      return false;
    }
  }
 
  function checkName(name){
    var mini = 2
    var maxi = 25
 
    if (document.formAjouter_Categorie.name.value.length == 0){
      alertify.alert("Le champ nom doit être renseigné");
      return false;
    }
    if (mini != 0) {
      if (document.formAjouter_Categorie.name.value.length < mini ) {
        alertify.alert("Le nom de la catégorie doit comporter au moins " + mini + " caractères.");
        return false;
      }
    }
    if (maxi != 0) {
      if (document.formAjouter_Categorie.name.value.length > maxi ) {
        alertify.alert("Le nom de la catégorie ne doit pas comporter plus de " + maxi + " caractères.");
        return false;
      }
    }
  }
}

Code HTML :

Code html :

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

<form name="formAjouter_Categorie" action="#" method="post"  onsubmit="return checkCategories()">

Pourriez vous m’éclaircir ? Je vous en remercie d'avance.

[SpaceFrog]

des fonctions DANS des fonctions ...

assez effrayant je dois le dire ...

a la limite un objet ???

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
 
var checkCategories = {
    checkSlug: function (slug) {
        var patt = new RegExpSlug(/^[a-z\-0-9]+$/);
 
        if (document.formAjouter_Categorie.slug.value.length == 0) {
            alertify.alert("Le champ nom doit être renseigné");
            return false;
        }
    },
    checkName: function (name) {
        var mini = 2
        var maxi = 25
 
        if (document.formAjouter_Categorie.name.value.length == 0) {
            alertify.alert("Le champ nom doit être ...");
        }
    }

[StryceK]

Désole de t'avoir effrayé

Donc j'ai prit en compte ta correction, j'obtiens donc ce code :

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
 
var checkCategories = {
  checkSlug : function (slug){
 
    if (document.formAjouter_Categorie.slug.value.length == 0){
      alertify.alert("Le champ nom doit être renseigné");
      return false;
    }
    if(document.formAjouter_Categorie.slug.value == (/^[a-z\-0-9]+$/)){
      alertify.alert("Le slug est incorrect");
      return false;
    }
  },
 
  checkName : function (name){
    var mini = 2
    var maxi = 25
 
    if (document.formAjouter_Categorie.name.value.length == 0){
      alertify.alert("Le champ nom doit être renseigné");
      return false;
    }
    if (mini != 0) {
      if (document.formAjouter_Categorie.name.value.length < mini ) {
        alertify.alert("Le nom de la catégorie doit comporter au moins " + mini + " caractères.");
        return false;
      }
    }
    if (maxi != 0) {
      if (document.formAjouter_Categorie.name.value.length > maxi ) {
        alertify.alert("Le nom de la catégorie ne doit pas comporter plus de " + maxi + " caractères.");
        return false;
      }
    }
  }
}

Il me semble qu'il est juste, ou alors arrête moi si je me trompe.
Cependant que dois-je mettre dans mon onsubmit de mon formulaire étant donné que c'est un objet ?

[SylvainPV]

Pourquoi effrayant SpaceFrog ? Une fonction est une variable locale tout à fait valable. On trouve ce pattern dans plein de bibliothèques. C'est même un pattern courant pour la déclaration de méthodes d'instance en POO JavaScript.

Strycek, dans ton premier code tu déclares deux fonctions au moment de l'appel de la fonction checkCategories. Mais ces fonctions, tu n'en fais rien avec. Peut-être que sous cette forme, le problème t'apparaîtra plus clair :

Code :

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

1
2
3
4
5
function checkCategories(){ 
   var checkSlug = function(slug){ ... };
   var checkName = function(name){ ... };
  //ici, il manque concrètement ce que doit faire la fonction checkCategories
}

[Watilin]

Je crois que StryceK s'attendait à ce que les fonctions « internes » soient exécutées dans la foulée. Du coup je pense que le post de Sylvain est très clair là-dessus.

Allez, j'en rajoute une couche quand même : les fonctions locales ne sont rien de plus que des variables locales. Il faut les appeler à la main sinon ça ne se fera pas tout seul

[StryceK]

Etrange, j'ai pourtant recopié exactement ta syntaxe Sylvain.
J'obtiens donc ceci :

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
function checkCategories(){
  var checkSlug = function(slug){
    if (document.formAjouter_Categorie.slug.value.length == 0){
      alertify.alert("Le champ nom doit être renseigné");
      return false;
    }
    if(document.formAjouter_Categorie.slug.value == (/^[a-z\-0-9]+$/)){
      alertify.alert("Le slug est incorrect");
      return false;
    }
  };
 
  var checkName = function (name){
    var mini = 2
    var maxi = 25
 
    if (document.formAjouter_Categorie.name.value.length == 0){
      alertify.alert("Le champ nom doit être renseigné");
      return false;
    }
    if (mini != 0) {
    if (document.formAjouter_Categorie.name.value.length < mini ) {
      alertify.alert("Le nom de la catégorie doit comporter au moins " + mini + " caractères.");
      return false;
      }
    }
    if (maxi != 0) {
      if (document.formAjouter_Categorie.name.value.length > maxi ) {
        alertify.alert("Le nom de la catégorie ne doit pas comporter plus de " + maxi + " caractères.");
        return false;
      }
    }
  }; 
}

Ainsi que mon bout de HTML :

Code html :

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

<form name="formAjouter_Categorie" action="#" method="post"  onsubmit="return checkCategories()">