Intereting Posts

Utilisation de CORS sur le serveur node.js sur une application phonegap Comment puis-je savoir si jsTree a complètement chargé? Objet n'a pas de méthode 'appliquer' Passer un élément de sélection de HTML dans un arbre avec des sous-menus La meilleure façon de déterminer si un argument n'est pas envoyé à la fonction JavaScript Modification de la couleur de la barre de navigation après le défilement? Comment distinguer les majuscules des plus bas dans la méthode du gestionnaire d'événements onkeydown Détecter la fenêtre du navigateur Maximisé / Minimisé avec Javascript Javascript: Comment accéder à RowDataPacket UserScripts & Greasemonkey: appelant les fonctions JavaScript d'un site Web Format date heure JavaScript Récupérer l'objet javascript array avec C ++ à l'aide de DISPID_NEWENUM échoue sur IE9 Comment extraire des données spécifiques du json en utilisant python Lorsque vous utilisez setInterval, si je change d'onglets dans Chrome et revenons en arrière, le curseur devient fou de rattrapage Comment sauvegarder dans la page d'options de stockage locale et l'obtenir en arrière-plan?

Arrêter un champ de saisie sous une forme d'envoi

J'écris un javascript (un greasemonkey / userscript) qui va insérer certains champs de saisie dans un formulaire sur un site Web.

La chose est que je ne veux pas que ces champs de saisie affectent le formulaire de quelque manière que ce soit, je ne veux pas qu'ils soient soumis lorsque le formulaire est soumis, je veux seulement que mon javascript ait accès à leurs valeurs.

Est-ce que je peux ajouter certains champs de saisie au milieu d'un formulaire et ne pas les faire soumettre lorsque le formulaire est soumis?

Évidemment, la chose idéale serait que les champs de saisie ne soient pas dans l'élément de formulaire, mais je souhaite que la mise en page de ma page résultante permette d'afficher mes champs de saisie insérés entre les éléments de la forme originale.

Vous pouvez insérer des champs de saisie sans attribut "nom"

<input type="text" id="in-between" />

Ou vous pouvez simplement les supprimer une fois le formulaire soumis (en jquery):

 $("form").submit(function() { $(this).children('#in-between').remove(); });

La chose la plus simple à faire serait d'insérer les éléments avec l'attribut disabled .

 <input type="hidden" name="not_gonna_submit" disabled="disabled" value="invisible" />

De cette façon, vous pouvez les accéder en tant qu'instruments du formulaire.

Les champs désactivés ont l'inconvénient que l'utilisateur ne peut pas interagir avec eux du tout, donc si vous avez un champ de texte disabled , l'utilisateur ne peut pas sélectionner le texte. Si vous avez une case à cocher disabled , l'utilisateur ne peut pas modifier son état.

Vous pouvez également écrire quelques javascript pour tirer sur la soumission du formulaire pour supprimer les champs que vous ne souhaitez pas envoyer.

Vous pouvez écrire un gestionnaire d'événements pour onsubmit qui supprime l'attribut de name de tous les champs de saisie que vous souhaitez ne pas inclure dans la soumission du formulaire.

Voici un exemple rapide non testé:

 var noSubmitElements = [ 'someFormElementID1', 'someFormElementID2' ]; //... function submitForm() { for( var i = 0, j = noSubmitElements.length; i < j; i++ ) { document.getElementById(noSubmitElements[i]).removeAttribute('name'); } } form.onsubmit = submitForm;

Essai simple pour supprimer l'attribut de nom de l'élément de saisie.
Il faut donc ressembler à

 <input type="checkbox" checked="" id="class_box_2" value="2">

Ajouter disabled = "disabled" in input et jquery supprimer l'attribut désactivé lorsque vous souhaitez le soumettre en utilisant .removeAttr ('disabled')

HTML:

<input type="hidden" name="test" value="test" disabled='disabled'/>

Jquery:

$("input[name='test']").removeAttr('disabled');

Je voulais juste ajouter une option supplémentaire: Dans votre saisie, ajoutez la balise du formulaire et spécifiez le nom d'un formulaire qui n'existe pas sur votre page:

 <input form="fakeForm" type="text" readonly value="random value" />

Gérer le formulaire de soumettre dans une fonction via onSubmit () et effectuer quelque chose comme ci-dessous pour supprimer l'élément de formulaire: Utilisez getElementById() du DOM, puis utilisez [object].parentNode.removeChild([object])

Supposons que votre champ en question possède un code d'identification "my_removable_field":

 var remEl = document.getElementById("my_removable_field"); if ( remEl.parentNode && remEl.parentNode.removeChild ) { remEl.parentNode.removeChild(remEl); }

Cela vous procurera exactement ce que vous recherchez.

Avez-vous même besoin d'être des éléments d'entrée en premier lieu? Vous pouvez utiliser Javascript pour créer dynamiquement des divs ou des paragraphes ou des éléments de liste ou tout ce qui contient les informations que vous souhaitez présenter.

Mais si l'élément interactif est important et qu'il est difficile de placer ces éléments en dehors du bloc <form> , il devrait être possible de supprimer ces éléments du formulaire lorsque la page est soumise.

Je sais que cette publication est ancienne, mais je répondrai quand même. La manière la plus simple / meilleure que j'ai trouvée soit simplement de définir simplement le nom en blanc.

Mettez ceci avant votre soumission:

 document.getElementById("TheInputsIdHere").name = "";

Dans l'ensemble, votre fonction de soumission pourrait ressembler à ceci:

 document.getElementById("TheInputsIdHere").name = ""; document.getElementById("TheFormsIdHere").submit();

Cela soumettra toujours le formulaire avec tous vos autres champs, mais ne le soumettra pas sans nom.

 $('#serialize').click(function () { $('#out').text( $('form').serialize() ); }); $('#exclude').change(function () { if ($(this).is(':checked')) { $('[name=age]').attr('form', 'fake-form-id'); } else { $('[name=age]').removeAttr('form'); } $('#serialize').click(); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form action="/"> <input type="text" value="John" name="name"> <input type="number" value="100" name="age"> </form> <input type="button" value="serialize" id="serialize"> <label for="exclude"> <input type="checkbox" value="exclude age" id="exclude"> exlude age </label> <pre id="out"></pre>

Vous devez ajouter onsubmit sous votre forme:

 <form action="YOUR_URL" method="post" accept-charset="utf-8" onsubmit="return validateRegisterForm();">

Et le script sera comme ceci:

  function validateRegisterForm(){ if(SOMETHING IS WRONG) { alert("validation failed"); event.preventDefault(); return false; }else{ alert("validations passed"); return true; } }

Cela fonctionne pour moi chaque fois 🙂