BreezingForms : calcul de bouton radio et cases a cocher

Réduire
X
 
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages

  • #16
    C'est la sauvegarde complète avec la triple protection anti spam : Formulaire Adhesion.zip
    Fichiers joints

    Commentaire


    • #17
      Je vois ça cet après-midi et reviens vers toi rapidement.
      Cordialement.
      __
      Eddy !!!
      Tutoriels BreezingForms en Français : https://www.breezingforms.eddy-vh.com/

      Commentaire


      • #18
        schtroumpf



        Je peux t'envoyer le formulaire corrigé mais ça ne t'apprendrai rien. Il vaut mieux que tu ccorriges toi-même en suivant les instructions suivantes.

        Veux-tu vérifier le script d'initialisation du champ Total à payer !!! Il y a quelque chose qui n'a rien à y faire…
        C'est la raison principale du non fonctionnement du formulaire.

        Pour que le formulaire fonctionne à 100%. Pour les checkbox, groupes de checkbox, groupes de boutons radio, la classe s'ajoute avec :
        Code:
        ff_getElementByName('nomDeChamp').parentNode.classList.add('maClasse);
        Pas

        Code:
        element.parentNode.classList.add('maClasse);
        Sinon la classe n'est pas envoyée à l'élément parent.

        Vérifie que le type d'action pour le champ "Type d'adhésion" soit bien à Modifier et non Clic

        Le champ Montan d'adhésion a un script d'action inutile pour un calcul. Il est à supprimer.

        Aussi, les champs Type d'adhésion et Liste des activités lancent le script ff_total_action(element, action); Tu as modifié le nom de Total par TotalPayer, il faut donc mettre le bout de script à jour => ff_TotalPayer_action(element, action);


        Après ces modifications, teste ton formulaire (sur le site, pas dans l'admin) et observe la console de ton navigateur. À chaque actualisation du formulaire, elle te renseignera si d'autres erreurs s'y trouvent.
        Dernière édition par Eddy.vh à 16/10/2020, 16h04
        Cordialement.
        __
        Eddy !!!
        Tutoriels BreezingForms en Français : https://www.breezingforms.eddy-vh.com/

        Commentaire


        • #19
          Envoyé par Eddy.vh Voir le message
          schtroumpf
          Je peux t'envoyer le formulaire corrigé mais ça ne t'apprendrai rien. Il vaut mieux que tu ccorriges toi-même en suivant les instructions suivantes.
          Je préfère aussi, merci

          Envoyé par Eddy.vh Voir le message
          schtroumpf
          Veux-tu vérifier le script d'initialisation du champ Total à payer !!! Il y a quelque chose qui n'a rien à y faire…
          C'est la raison principale du non fonctionnement du formulaire.
          Alors là je vois pas du tout l’intrus. J'ai même recréé le code framework pour comparer, mais je ne vois pas de différence.

          Envoyé par Eddy.vh Voir le message
          schtroumpf
          Pour que le formulaire fonctionne à 100%. Pour les checkbox, groupes de checkbox, groupes de boutons radio, la classe s'ajoute avec :
          Code:
          ff_getElementByName('nomDeChamp').parentNode.classList.add('maClasse);
          Pas

          Code:
          element.parentNode.classList.add('maClasse);
          Sinon la classe n'est pas envoyée à l'élément parent.
          Modifié. Merci pour le signalement.

          Envoyé par Eddy.vh Voir le message
          schtroumpf
          Vérifie que le type d'action pour le champ "Type d'adhésion" soit bien à Modifier et non Clic
          Ah oui il était sur clic . J'ai modifié.

          Envoyé par Eddy.vh Voir le message
          schtroumpf
          Le champ Montan d'adhésion a un script d'action inutile pour un calcul. Il est à supprimer.
          C'est le script qui devrait être dans le champ Total à payer (et qui est bien présent dedans) ! qu'est-ce qu'il fait là ?! je l'ai viré.

          Envoyé par Eddy.vh Voir le message
          schtroumpf
          Aussi, les champs Type d'adhésion et Liste des activités lancent le script ff_total_action(element, action); Tu as modifié le nom de Total par TotalPayer, il faut donc mettre le bout de script à jour => ff_TotalPayer_action(element, action);
          J'avais pas fait gaffe à ce bout de code qu'il fallait modifier.

          Commentaire


          • #20
            Envoyé par schtroumph Voir le message
            Alors là je vois pas du tout l’intrus. J'ai même recréé le code framework pour comparer, mais je ne vois pas de différence.
            Sur le formulaire que tu m'as envoyé, dans script d'initialisation du champ "Total à payer", je trouve ceci :
            Code:
            //----- CODE POUR LA CLASS -----
            function ff_TotalPayer_init(element, condition)
            {
            switch (condition) {
            case 'formentry':
            element.parentNode.classList.add('total-payer');
            break;
            default:;
            } // switch
            } // ff_TotalPayer_init
            
            - Script Action, cocher "Clic" :
            
            //----- CODE POUR LE CALCUL -----
            function ff_TotalPayer_action(element, action)
            {
            
            ff_getElementByName('TotalPayer').value =
            Number(ff_getElementByName('MontantAdhesion').valu e) +
            Number(ff_getElementByName('TotalActivites').value ) + " €";
            
            } // ff_TotalPayer_action
            où toute la partie après
            Code:
            } // ff_TotalPayer_init
            fout le souc.

            Les scripts sont pointilleux, un manque d'apostrophe, un manque de point-virgule ou double-point comme ça arrive parfois, une faute de frappe dans un nom de champ, et rien ne fonctionne.
            Perso, lorsque je construis un formulaire, je n'y place pas les validations de suite, de sorte à pouvoir naviguer dans le formulaire sans contrainte, je l'ouvre toujours dans un onglet à part
            - dans l'interface d'édition du formulaire cliquer "Site de prévisualisation" dans la popup qui s'ouvre, clic droit, ce cadre -> Ouvrir ce cadre dans un nouvel onglet. -
            À chaque écriture d'un script, j'enregistre la modification, le formulaire et je teste, si tout fonctionne, je passe à la suite sinon, je corrige. De cette manière, je sais toujours où j'ai commis l'erreur.

            Les développeurs en JS ont probablement des outils de débogage qui les aide, je n'en ai pas et donc je teste bien chaque étape de création.
            Dernière édition par Eddy.vh à 19/10/2020, 11h45
            Cordialement.
            __
            Eddy !!!
            Tutoriels BreezingForms en Français : https://www.breezingforms.eddy-vh.com/

            Commentaire


            • #21
              Faut que je fasse le ménage dans mes formulaires d’adhésion de tests ! j'ai 50 versions différentes (bon, 50 j’exagère beaucoup quant même lol) d'installés et je sais même plus d’où j'ai sauvegardé celui que je t'ai envoyé. Je vais tous les virer, installer ce dernier et le modifier par rapport a ton message #18.

              Et je vais m'organiser comme toi en y allant petit a petit.
              Dernière édition par schtroumph à 19/10/2020, 10h13

              Commentaire


              • #22
                J'ai trouvé pourquoi les champ anti spam apparaissaient ! ce que j'ai fait, pour suivre ta manière de faire, j'ai supprimé tous les champs avec des scripts (sauf ceux des coordonnées). Les champs anti spam ont disparu. Et j'ai refait, un par un en testant au fur et à mesure, les champs supprimé. Ça venait du champ avec la case à cocher pour accepter l'utilisation des données perso. Dans une ligne du code du script d'initialisation pour mettre une class j'avais oublié une apostrophe :
                Code:
                ff_getElementByName('AdhesionDonneesPerso').parentNode.classList.add('donnees-perso);
                Avec cette apostrophe les champs anti spam disparaissent. Je continu pour voir s'il y a d'autres erreurs.

                Commentaire


                • #23
                  Il faut faire gaffe à tout dans les scripts, un guillemet d'ouverture attend un guillemet de fermeture, si tu en oublies un, le script englobe tout ce qui se trouve jusqu'au prochain guillemet.
                  Et bien entendu, ça plante…

                  Avec BreezingForms pour Joomla! 4 (que je teste actuellement), nous aurons un éditeur de script avec coloration syntaxique, on se rendra plus facilement compte de nos erreurs de frappe et on pourra corriger plus facilement.
                  Dernière édition par Eddy.vh à 19/10/2020, 11h49
                  Cordialement.
                  __
                  Eddy !!!
                  Tutoriels BreezingForms en Français : https://www.breezingforms.eddy-vh.com/

                  Commentaire


                  • #24
                    Ça marche ! je suis trop fort .. bon heureusement que tu étais là car je ne m'en serais pas sortie seul . Je vais me le garder très précieusement si jamais je doit mettre en place un autre formulaire d’adhésion.

                    Merci beaucoup pour ton aide et du temps passé

                    Commentaire


                    • #25
                      Envoyé par Eddy.vh Voir le message
                      schtroumpf
                      Pour que le formulaire fonctionne à 100%. Pour les checkbox, groupes de checkbox, groupes de boutons radio, la classe s'ajoute avec :
                      Code:
                      ff_getElementByName('nomDeChamp').parentNode.classList.add('maClasse);
                      Pas

                      Code:
                      element.parentNode.classList.add('maClasse);
                      Sinon la classe n'est pas envoyée à l'élément parent.
                      Je suis en train de refaire un formulaire de contact pour l'association. Pour ajouter les class aux cases à cocher, aux groupe de cases à cocher et au groupe de bouton radio j'ai donc suivis ce que tu m'avais dit. Mais j'ai un groupe de boutons radio pour lequel la class ne s'affiche pas. Le champ se nome ContactDestinataires.

                      Le script :

                      Code:
                      function ff_ContactDestinataires_init(element, condition)
                      {
                          switch (condition) {
                              case 'formentry':
                              ff_getElementByName('ContactDestinataires').parentNode.classList.add('contact-destinataire');
                                  break;
                              default:;
                          } // switch
                      } // ff_ContactDestinataires_init
                      Qu'est-ce que j'ai raté ou qu'est-ce que je n'ai pas compris ?

                      Commentaire


                      • #26
                        Ca semble correct.
                        Contrôle ta console voir s'il n'y a une erreur.
                        Cordialement.
                        __
                        Eddy !!!
                        Tutoriels BreezingForms en Français : https://www.breezingforms.eddy-vh.com/

                        Commentaire


                        • #27

                          J'ai ce message :

                          Code:
                          Uncaught TypeError: ff_getElementByName(...) is null
                              ff_ContactPartenaireVousEtes_init http://localhost/SITE-TESTS/contact.html:445
                              ff_initialize http://localhost/SITE-TESTS/contact.html:366
                              onload http://localhost/SITE-TESTS/contact.html:370
                          contact.html:445:56
                              ff_ContactPartenaireVousEtes_init http://localhost/SITE-TESTS/contact.html:445
                              ff_initialize http://localhost/SITE-TESTS/contact.html:366
                              onload http://localhost/SITE-TESTS/contact.html:370
                          J'ai suivis le lien En savoir plus mais ça ne m'a pas avancé plus (pour dire que je n'ai rien compris lol).

                          Edit 01 :

                          Je n'ai plus d'erreur dans la console car je me suis rendu compte que pour certain script j'avais écris

                          Code:
                          ff_getElementByName('nomDeSection').parentNode.classList.add('maClasse);
                          au lieu de

                          Code:
                          ff_getElementByName('nomDeChamp').parentNode.classList.add('maClasse);
                          Mais la class n'est toujours pas présente.

                          Edit 02 :

                          Pour être certain que j'ai bien compris, ce bout de code c'est bien pour ajouter la class juste âpres la class bfLabelLeft de la balise section :

                          Code:
                          <section class="bfElemWrap bfLabelLeft MaClass" id="bfElemWrap1290">
                          <label id="bfLabel1290" for="ff_elem1290">Choisir un destinataire<span class="bfRequired">*</span>
                          </label>
                          <span class="bfElementGroupNoWrap contact-destinataire" id="bfElementGroupNoWrap1290">
                          <input class="ff_elem" type="radio" name="ff_nm_ContactDestinataires[]" value="contact@hegaldi-jatxou.fr" id="ff_elem1290"><label class="bfGroupLabel" id="bfGroupLabel1290" for="ff_elem1290">L'association</label>
                          <input class="ff_elem" type="radio" name="ff_nm_ContactDestinataires[]" value="contact@sorgin-informatique.com" id="ff_elem1290_1"><label class="bfGroupLabel" id="bfGroupLabel1290_1" for="ff_elem1290_1">Gestionnaire du site</label>
                          </span>
                          </section>
                          Parce que je me suis rendu compte que ma class est dans le second span :

                          Code:
                          <section class="bfElemWrap bfLabelLeft" id="bfElemWrap1290">
                          <label id="bfLabel1290" for="ff_elem1290">Choisir un destinataire<span class="bfRequired">*</span>
                          </label>
                          <span class="bfElementGroupNoWrap contact-destinataire" id="bfElementGroupNoWrap1290">
                          <input class="ff_elem" type="radio" name="ff_nm_ContactDestinataires[]" value="contact@hegaldi-jatxou.fr" id="ff_elem1290"><label class="bfGroupLabel" id="bfGroupLabel1290" for="ff_elem1290">L'association</label>
                          <input class="ff_elem" type="radio" name="ff_nm_ContactDestinataires[]" value="contact@sorgin-informatique.com" id="ff_elem1290_1"><label class="bfGroupLabel" id="bfGroupLabel1290_1" for="ff_elem1290_1">Gestionnaire du site</label>
                          </span>
                          </section>
                          Dernière édition par schtroumph à 24/10/2020, 10h22

                          Commentaire


                          • #28
                            ff_getElementByName('nomdDeChamp') = champ cible, .parentNode = premier parent de l'élément, classList.add ajoute une classe à celles déjà présentes.
                            Le span est ciblé parce que ton input s'y trouve…

                            La bibliothèque BF permet de cibler les champs par leur nom (ff_getElementByName), pas les sections puisqu'elles n'ont pas de nom.

                            Aussi, j'ai remarqué que tu ajoutes une classe différente à chaque champ. Dans quel but ? Parce que, hormis à vouloir formater par css chaque champ différemment, ça n'a aucun sens. Peux-tu expliquer pourquoi tu souhaites ajouter des classes ?

                            Si tu veux cibler une section pour la différencier des autres, il y a plus simple que cibler les parents.

                            Dans l'onglet script des options avancées du formulaire, après avoir créé la structure du code, il suffit d'ajouter :
                            document.getElementById('idDeSection').classList.a dd('maClasse');
                            Tu peux trouver l'id de la section en l'examinant avec la console du navigateur mais BF utilise le nom de la section pour former l'id.

                            Étudie bien la nécessité d'ajouter tout ça parce que ça alourdit le formulaire peut-être inutilement, même mon dernier exemple est inutile. Si tu peux cibler une section par son id, tu n'as pas besoin de le faire par une classe…

                            Cordialement.
                            __
                            Eddy !!!
                            Tutoriels BreezingForms en Français : https://www.breezingforms.eddy-vh.com/

                            Commentaire


                            • #29
                              Pour les section j'utilise effectivement leurs id. Pour les éléments je t'avoue que j'ai pris cette habitude de mettre une class partout, alors que je ne les utilise pas. Des fois oui, mais pas pour tous les éléments. En lisant ta réponse je me rends compte que ce n'est pas utile, sauf si je veux cibler un ou plusieurs éléments bien précis. Mais pour les autres pas besoin. Je vais revoir ma manière de faire les formulaires.

                              J'ai compris pourquoi l'ajout d'une class ne marche pas avec les boutons radios et groupe de cases à cocher !!! vaut mieux tard que jamais (grâce à ton explication). Le .parentNode est le premier parent de l'élément comportant le nom de l’élément. Hors pour les boutons radios et groupe de case à cocher la balise ayant le nom de l’élément as deux parents ! il faut donc en ajouter un :

                              Code:
                              ff_getElementByName('NomElement').parentNode.paren tNode.classList.add('class');
                              Dernière édition par schtroumph à 26/10/2020, 09h04

                              Commentaire


                              • #30
                                Envoyé par schtroumph Voir le message
                                Code:
                                ff_getElementByName('NomElement').parentNode.paren tNode.classList.add('class');
                                Déduction logique !

                                Cordialement.
                                __
                                Eddy !!!
                                Tutoriels BreezingForms en Français : https://www.breezingforms.eddy-vh.com/

                                Commentaire

                                Annonce

                                Réduire
                                1 sur 2 < >

                                C'est [Réglé] et on n'en parle plus ?

                                A quoi ça sert ?
                                La mention [Réglé] permet aux visiteurs d'identifier rapidement les messages qui ont trouvé une solution.

                                Merci donc d'utiliser cette fonctionnalité afin de faciliter la navigation et la recherche d'informations de tous sur le forum.

                                Si vous deviez oublier de porter cette mention, nous nous permettrons de le faire à votre place... mais seulement une fois
                                Comment ajouter la mention [Réglé] à votre discussion ?
                                1 - Aller sur votre discussion et éditer votre premier message :


                                2 - Cliquer sur la liste déroulante Préfixe.

                                3 - Choisir le préfixe [Réglé].


                                4 - Et voilà… votre discussion est désormais identifiée comme réglée.

                                2 sur 2 < >

                                Assistance au forum - Outil de publication d'infos de votre site

                                Compatibilité: PHP 4.1,PHP4, 5, 6DEV MySQL 3.2 - 5.5 MySQLi from 4.1 ( @ >=PHP 4.4.9)

                                Support Version de Joomla! : | J!3.0 | J!2.5.xx | J!1.7.xx | J!1.6.xx | J1.5.xx | J!1.0.xx |

                                Version française (FR) D'autres versions sont disponibles depuis la version originale de FPA

                                UTILISER À VOS PROPRES RISQUES :
                                L'exactitude et l'exhaustivité de ce script ainsi que la documentation ne sont pas garanties et aucune responsabilité ne sera acceptée pour tout dommage, questions ou confusion provoquée par l'utilisation de ce script.

                                Problèmes connus :
                                FPA n'est actuellement pas compatible avec des sites Joomla qui ont eu leur fichier configuration.php déplacé en dehors du répertoire public_html.

                                Installation :

                                1. Téléchargez l'archive souhaitée : http://afuj.github.io/FPA/

                                Archive zip : https://github.com/AFUJ/FPA/zipball/master

                                2. Décompressez le fichier de package téléchargé sur votre propre ordinateur (à l'aide de WinZip ou d'un outil de décompression natif).

                                3. Lisez le fichier LISEZMOI inclus pour toutes les notes de versions spécifiques.

                                4. LIRE le fichier de documentation inclus pour obtenir des instructions d'utilisation détaillées.

                                5. Téléchargez le script fpa-fr.php à la racine de votre site Joomla!. C'est l'endroit que vous avez installé Joomla et ce n'est pas la racine principale de votre serveur. Voir les exemples ci-dessous.

                                6. Exécutez le script via votre navigateur en tapant: http:// www. votresite .com/ fpa-fr.php
                                et remplacer www. votresite .com par votre nom de domaine


                                Exemples:
                                Joomla! est installé dans votre répertoire web et vous avez installé la version française du fichier FPA:
                                Télécharger le script fpa-fr.php dans: /public_html/
                                Pour executer le script: http://www..com/fpa-fr.php

                                Joomla! est installé dans un sous-répertoire nommé "cms" et vous avez installé la version française du fichier FPA:
                                Télécharger le script fpa-fr.php dans: /public_html/cms/
                                Pour executer le script: http://www..com/cms/fpa-fr.php

                                En raison de la nature très sensible de l'information affichée par le script FPA, il doit être retiré immédiatement du serveur après son utilisation.

                                Pour supprimer le script de votre site, utilisez le lien de script de suppression fourni en haut de la page du script. Si le lien de suppression échoue pour supprimer le script, utilisez votre programme FTP pour le supprimer manuellement ou changer le nom une fois que le script a généré les données du site et le message publié sur le forum. Si le script est toujours présent sur le site, il peut être utilisé pour recueillir suffisamment d'informations pour pirater votre site. Le retrait du script empêche des étrangers de l'utiliser pour jeter un oeil à la façon dont votre site est structuré et de détecter les défauts qui peuvent être utilisé à vos dépends.
                                Voir plus
                                Voir moins

                                Partenaire de l'association

                                Réduire

                                Hébergeur Web PlanetHoster
                                Travaille ...
                                X