Discussion :

[flipflip]

Bonjour à tous,

J'ai ce formulaire

Code html :

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

1
2
3
4
5
<form method="#" name="formCreateProposition" id="formCreateProposition">
  <input type='text' id='itmref' name='line[0][itmref]' value=''>
  <input type='text' id='qty' name='line[0][qty]' class='qty'>
  <button type="button" id="btRegisterProposition" onClick="portail.crm.registerProposition()">Enregistrer</button>
</form>

Côté javascript j'ai ce code pour traiter le formulaire

Code javascript :

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
publics.registerProposition = function() {
    $('.qty').each(function() {
      $(this).rules('add',
        {
            required: true,
            messages: { 
              required: 'Quantité obligatoire',
            }
        });
    });
 
    $('#formCreateProposition').validate();
 
    formData.push({name: 'a', value: 'registerproposition'});
    formData.push({name: 'j', value: '1'});
 
$.ajax({
      url: config['url'] + config['plugin'] + config['include'] + '/form.php',
      type: 'POST',
      dataType: 'json',
      data: formData,
...
}

Sur ce test mon but est de vérifier que le champ .qty n'est pas vide. Lorsque je clic sur le bouton btRegisterProposition en laissant .qty vide le code passe totalement au travers du test du champ et continu tranquillement l'exécution pour s'écraser bêtement avec l'erreur :

Code :

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

 Uncaught TypeError: a.data(...) is undefined

De ce que j'ai compris c'est parce que je ne passe pas vraiment par Submit() et il y aurait un moyen de contourner ça mais je n'ai pas trouvé de doc qui explique vraiment (ou alors j'ai rien compris) comment faire. Est-ce que vous avez déjà été confronté à ce problème ?

P.S. : ça fait peu de temps que je bricole avec jquery

[mathieu]

d'où vient "publics.registerProposition" ?
vous utilisez un framework qui vous oblige d'utiliser jQuery ?

[flipflip]

vous utilisez un framework qui vous oblige d'utiliser jQuery ?

Non c'est par choix (ou méconnaissance ) j'utilise jquery-ui aussi.

d'où vient "publics.registerProposition" ?

J'ai éclaté les fonctions js dans plusieurs fichiers suivant le module utilisé sur le site. J'appelle le fichier .js correspondant au module et le fichier a cette structure :

Code javascript :

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
 
(function (publics) {
  "use strict";
 
  publics.function1 = function () {
...
  }
 
  publics.function2 = function () {
...
  }
...
 
publics.init = function () {
    var module = $("#app").attr("data-module");    
 
    if(module == "function1") {
      publics.function1();
    } else if(module == "function2") {
      publics.function2();
    }
  };
}(app.crm={}));

Ensuite dans la partie html l'appel à une fonction peut-être fait de cette manière

Code html :

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

  <button type="button" id="btRegisterProposition" onClick="portail.app.funciton1()">Enregistrer</button>

[mathieu]

les navigateurs actuels proposent de plus en plus d'améliorations dans l'utilisation du code javascript donc je vous conseille de ne plus passer par jQuery mais d'utiliser les méthodes javascript directement.
regardez garder les url suivants qui donnent beaucoup d'exemples de remplacement de jQuery par du code javascript direct :
https://youmightnotneedjquery.com/
https://github.com/camsong/You-Dont-...r/README-fr.md

pour votre souci de code lancé à la soumission du formulaire, commencez déjà par retirer le code javascript mélangé au code html et utilisez plutot un écouteur d'évènement :
https://developer.mozilla.org/fr/doc...dEventListener
et ensuite au lieu d'écouter l'évènement "clic" du bouton, essayer d'écouter l'évènement "submit" du formulaire.

[flipflip]

Ok merci pour toutes ces infos.

N'étant pas dev je ne suis pas trop l'actualité et les évolutions. J'ai utilisé il y a quelques années jquery et je suis resté sur ce presque acquis, malgré quelques recherches pour monter en compétences je n'ai pas vraiment trouvé de site pouvant m'aider.

Je vais regardé tout ça.

[flipflip]

Pour compléter je pense que je vais reprendre à zéro en suivant cette série de vidéos : https://grafikart.fr/tutoriels/intro...-2054#autoplay

[mathieu]

si vous avez le temps, je pense aussi que ça peut être intéressant de recommencer le projet sans jQuery.

une autre possibilité serait de garder la base en jQuery et de continuer à développer en javascript direct mais vous aurez alors un mélange de 2 styles de code qui sera très compliqué à relire si vous revenez dessus dans quelques mois.

[flipflip]

Par chance je n'ai pas fait un usage intensif de jquery.

Je vais prendre l'option de faire les nouveaux sans jquery et ensuite petit à petit remplacer le code historique pour arriver au final à me passer de jquery.

J'ai lister rapidement les usages fait de jquery (plus jquery-ui même) :
- chargement de bloc de contenu de page par rapport à des filtres formulaires;
- autocomplète;
- accordéon;
- onglet;
- contrôle de formulaire et envoi sans rechargement (en cours de dev).