Partage
  • Partager sur Facebook
  • Partager sur Twitter

Stocker saisie dans un <input type="hidden">

Sujet résolu
    1 août 2011 à 14:04:38

    Bonjour,

    J'aimerais que mes utilisateurs saisissent des informations via une textarea.
    Je stocke ensuite toutes ces informations dans un champs hidden, pour ensuite valider le tout par le biais d'un formulaire.

    Seulement, comme vous vous en doutez, lorsque l'utilisateur saisi des textes comme : Bonjour, j'aime saisir des textes "alambiqués"><, ça foire.

    Il y aura-t-il une fonction jquery se chargeant de ça ? La fonction html ne remplace pas les '"', et j'ai un peu peur qu'elle oublie d'autres caractères...


    Merci pour votre aide !
    • Partager sur Facebook
    • Partager sur Twitter
      1 août 2011 à 14:16:48

      Ce serait plutôt la fonction 'val' (et non 'html') qu'il faudrait utiliser.

      Et je ne voit pas trop en quoi le fait de taper des guillemets te cause des problèmes :(

      A la limite, si tu t'en ressert par la suite en PHP, il y a des fonctions pour encoder correctements les guillemets ;)
      • Partager sur Facebook
      • Partager sur Twitter
        1 août 2011 à 14:22:44

        Perso, je vois surtout pas l’intérêt de copier le contenu de ton textarea dans un input hidden.... Mais si tu as une bonne raison fais nous en part ;)
        • Partager sur Facebook
        • Partager sur Twitter
          1 août 2011 à 14:59:20

          En fait, je code actuellement un calendrier visuel. Dès que je modifie un événement de mon calendrier, il faut que je modifie dans la base les informations de l'événement.

          Une requête AJAX serait parfaite dans le cas de peu de modification. Mais il y a fort à parier que mes utilisateurs bidouillent pas mal les événements avant de valider. Dans un soucis de simplicité, je traite tout sous forme de formulaire.

          Lorsque l'utilisateur a terminé de bidouiller ses événements, il clique sur "soumettre", et là le formulaire est analysé en PHP. Cela me permet d'éviter la requête BDD à chaque modification d'un événement.

          Je pourrais bien évidemment attendre 1 minute avant d'effectuer la requête, mais ma solution me semble assez simple.

          Du coup, l'utilisateur peut poster un commentaire sur l'événement. Je stocke ce commentaire dans le hidden.

          Si l'utilisateur utilise des apostrophes et des guillemets, mon hidden html ne passe plus. Les apostrophes perturbent le tout.


          Quant au problème de tout copier dans un hidden, c'est qu'un même textarea servira à tous les événements (affichage par le biais d'une modale).
          Bref, je cherche à échapper tous les caractères qui pourraient me nuire, je cherche à échapper mon html pour n'avoir que des caractères qui ne m'embêtent plus.


          Pour l'instant j'utilise :

          var value = myEvent.data[dataKey];
          			    value = value.replace(/"/g, '&quot;');
          			    value = value.replace(/'/g, '&#039;');
          			    value = $('<div />').text(value).html();
          


          Les apostrophes et les guillemets ne sont pas vraiment échappés, je ne sais pas trop pourquoi...
          • Partager sur Facebook
          • Partager sur Twitter
            1 août 2011 à 15:12:53

            Désolé,

            mais j'ai un peu de mal a comprendre pourquoi tu fais pas ta requête AJAX au moment de cliquer sur "soumettre" : t'as pas a stocker de cette manière la valeur de ton textarea et a moins d'avoir une fréquentation de 20 000 visiteurs par jour, je vois pas un impact énorme a faire la requête AJAX a chaque modification. (et puis, tu penses vraiment que les utilisateurs vont modifier 15 évènements a chaque fois? Ça me parait peu probable :) )

            PS : En fait, j'ai pas compris si ce bouton soumettre se trouvait dans la fenêtre modale ou dans la page du calendrier. Je suppose que c'est cette dernière page. En plus niveau traitement, faire tous les updates en même temps ça induit un niveau de complication de traitement qui me semble pas nécessaire ;)
            • Partager sur Facebook
            • Partager sur Twitter
              1 août 2011 à 15:23:03

              Citation

              $('<div />')


              C'est un sélecteur valid ça ???

              Et puis ça sert à quoi de faire "value = $('<div />').text(value).html();" ?

              Et je ne vois troujours pas en quoi des guillemets posent problème.
              Pourrais tu détailler plus en détaille les problèmes qu'il y a quand tu les laissent ?
              • Partager sur Facebook
              • Partager sur Twitter
                1 août 2011 à 15:54:32

                Citation : miclebowski

                Désolé,

                mais j'ai un peu de mal a comprendre pourquoi tu fais pas ta requête AJAX au moment de cliquer sur "soumettre" : t'as pas a stocker de cette manière la valeur de ton textarea et a moins d'avoir une fréquentation de 20 000 visiteurs par jour, je vois pas un impact énorme a faire la requête AJAX a chaque modification. (et puis, tu penses vraiment que les utilisateurs vont modifier 15 évènements a chaque fois? Ça me parait peu probable :) )

                PS : En fait, j'ai pas compris si ce bouton soumettre se trouvait dans la fenêtre modale ou dans la page du calendrier. Je suppose que c'est cette dernière page. En plus niveau traitement, faire tous les updates en même temps ça induit un niveau de complication de traitement qui me semble pas nécessaire ;)


                Ta réponse m'intéresse. De toute façon, il va falloir trouver un moyen de transmettre toutes les données au serveur, même si je passe par ajax.
                C'est fonctionnel dans le cas d'un seul événement : les données sont transmises en GET, et c'est pas compliqué.

                Par contre, si on a 30 événements modifiés, ça devient plus compliqué à transmettre en GET. Un champs hidden n'est pas si compliqué que ça :D ?

                Je pourrais effectuer une requête par modification, mais j'ai bien peur pour mon serveur. Mon projet attend un nombre d'utilisateurs conséquent.
                Si j'ai 30 utilisateurs qui effectuent 15 modifications par minutes (resize des events, puis déplacement, puis modification...), j'obtiens par minute 450 requêtes. Contre 30 avec ma méthode.


                lorrio > Oui, je crois que c'est valide. La fonction html convertit par exemple les "&" en "&amp;".
                Si je laisse les guillemets, j'obtiens un hidden de la forme :

                "<input type="hidden" value= "Bonjour j'aime le "code"" />"
                Vois-tu le soucis ?

                Merci pour vos réponses :-)
                • Partager sur Facebook
                • Partager sur Twitter
                  1 août 2011 à 17:07:41

                  Tu as un serveur dédié ou tu es en mutualisé?

                  Sinon, effectivement pour limiter le nombre de requêtes, voila ce que j'imagine :

                  1) Pour les modifications d’évènement, call AJAX systématique (tout ce qui implique les textarea)
                  2) Pour les resize, déplacements et le reste, call AJAX en cas de clic sur "soumettre"

                  Solution alternative : Si tu utilises une méga requête AJAX, tu peux stocker le contenu du textarea dans un div caché (tu en crées un par modif) et tu le récupères au moment de la requête avec la fonction text() de jQuery.
                  • Partager sur Facebook
                  • Partager sur Twitter
                    1 août 2011 à 17:14:55

                    Je suis pour l'instant en mutua, on verra bien si nos besoins évoluent en fonction de notre succès ;-)

                    J'aime bien ta solution, à moyen terme je la mettrai en place.
                    Je crois que je vais continuer là dessus ;-)

                    Merci pour ton aide !
                    • Partager sur Facebook
                    • Partager sur Twitter
                      1 août 2011 à 17:28:35

                      Citation

                      "<input type="hidden" value= "Bonjour j'aime le "code"" />"
                      Vois-tu le soucis ?


                      Oui, je vois très bien.

                      Ce que je ne vois pas très bien, c'est comment tu insères ton texte à l'interieur de ton input.
                      C'est sur que si tu fais :
                      var input = $('<input type="hidden" value="' + value + '" />')
                      

                      Alors oui, ça ne marche pas.

                      Mais si tu fais :
                      // Etape 1 : on cré l'input vide
                      var input = $('<input type="hidden" value="" />');
                      // Etape 2 : on ajoute la valueur 
                      // Note : là, tu es sur que jQuery formatera correctement TOUT les caratères, donc tu peux enlever TOUT les replaces
                      input.val(value);
                      

                      Alors ça marchera parfaitement.

                      • Partager sur Facebook
                      • Partager sur Twitter
                        2 août 2011 à 11:47:41

                        Merci lorrio, tu viens de m'apprendre quelque chose :-)

                        Merci à vous deux
                        • Partager sur Facebook
                        • Partager sur Twitter
                          2 août 2011 à 12:41:59

                          Mais de rien :)

                          Et c'est aussi valable pour tout les autres champs.

                          A supposer que tu l'attribut type pouvait changé et que tu fais :
                          var input = $('<input type="' + type + '" value="" />');
                          

                          On retombe sur le même problème (bon, ok, mauvais exemple, y'a jamais de " dans type mais il me fallait un exemple :-° )

                          Mais jQuery a pensé à tout avec 'attr'
                          var input = $('<input />');
                          input.attr("type", type);
                          input.val(value);
                          


                          D'ailleur, '.val(x);' est juste un raccourcit pour '.attr("value", x);' il me semble :)
                          • Partager sur Facebook
                          • Partager sur Twitter

                          Stocker saisie dans un <input type="hidden">

                          × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                          × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
                          • Editeur
                          • Markdown