web-dev-qa-db-fra.com

Modifier les valeurs du formulaire après avoir appuyé sur le bouton Soumettre

[EDIT] Après avoir beaucoup fouillé, j'ai découvert que le problème était dans la façon dont j'ai intégré le CKEditor dans ma page. La manière simple et évidente fonctionne fonctionne dans ce cas, comme indiqué dans la réponse acceptée.

Salut,

Je dois modifier les valeurs d'un formulaire, après avoir appuyé sur le bouton Soumettre, mais avant que la soumission proprement dite n'ait eu lieu.

J'ai essayé de me connecter à l'événement "soumettre" du formulaire et d'y modifier manuellement les valeurs des champs de texte, mais il semble que cela ne change pas réellement les valeurs soumises.

Des idées?

17
Editorman

Je suis curieux de savoir que vous avez dit que le gestionnaire submit ne fonctionnait pas pour vous. Ça fait pour moi. Je l'utilise depuis des années pour remplir des champs cachés avant d'envoyer des formulaires; devrait également fonctionner pour d'autres champs de formulaire.

Exemple ( copie en direct ):

HTML:

<form id='theForm'
    action='http://www.google.com/search'
    method='GET' target='_new'>
      <label>Search for:
        <input type='text' name='q' id='txtSearch'></label>
      <input type='submit' id='btnSearch' value='Search'>

JavaScript:

window.onload = function() {

  document.getElementById('theForm').onsubmit = function() {
    var txt = document.getElementById('txtSearch');
    txt.value = "updated " + txt.value;
  };
};​

Testé et fonctionnant sur IE6 et IE7 sous Windows, et Chrome, Firefox et Opera sous Linux.


Mise à jour : Sur la base de votre commentaire ci-dessous, vous utilisez jQuery. Fonctionne très bien en utilisant jQuery pour tout:

$('#theForm').submit(function() {
  var txt = $('#txtSearch');
  txt.val("updated " + txt.val());
});

exemple en direct Testé et fonctionnant sur le même ensemble de navigateurs. Cette version utilise une recherche plus ouverte plutôt qu'une id, et fonctionne toujours.

20
T.J. Crowder

Vous devez empêcher l'action d'envoi par défaut, puis soumettre à nouveau le formulaire vous-même manuellement:

$('form').submit(function(e) {
    e.preventDefault();

    // do your processing

    this.submit(); // call the submit function on the element rather than 
                   // the jQuery selection to avoid an infinite loop
});
12
lonesomeday

Avez-vous essayé d'ajouter une fonction en cliquant sur l'événement JavaScript sur le bouton Soumettre et de modifier les valeurs? Cela peut fonctionner car le script client s'exécutera en premier

1
Sreedhar K