2010-03-27 12 views
171

Utiliser 'submit' de jQuery - existe-t-il un moyen de transmettre des paramètres supplémentaires à un formulaire? Je ne cherche pas à le faire avec Ajax - c'est normal, rafraîchissement-soumission de formulaire typique.jQuery - ajouter des paramètres supplémentaires sur submit (NOT ajax)

$('#submit').click(function() { 
    $('#event').submit(function() { 
     data: { 
     form['attendees'] = $('#attendance').sortable('toArray').toString(); 
    }); 
}); 
+0

Quelle technologie côté serveur utilisez-vous? – Enrique

+0

ASP.NET MVC avec C#. – Ciel

+0

Voir ma réponse [ici] [1], qui s'ajoute à un formulaire sérialisé avant de l'envoyer. [1]: http://stackoverflow.com/questions/17809056/how-to-add-additional-fields-to-form-before-submit –

Répondre

301

Celui-ci l'a fait pour moi:

var input = $("<input>") 
       .attr("type", "hidden") 
       .attr("name", "mydata").val("bla"); 
$('#form1').append($(input)); 

est basé sur la réponse du Daff, mais il a ajouté l'attribut NAME pour le montrer dans la collection de forme et la valeur modifiée à VAL Également vérifié l'ID du formulaire (formulaire1 dans mon cas)

utilisé le Firefox firebug pour vérifier si l'élément a été inséré.

éléments cachés ne soient réaffectés dans la collection de forme, sont mis au rebut uniquement des champs en lecture seule.

Michel

+40

Comment chanter «tu es mon rayon de soleil» en binaire? Merci beaucoup. Cela résout tellement de choses. – Ciel

+3

Eh bien j'ai oublié l'attribut de nom ... – Daff

+34

Vous pouvez légèrement améliorer la lisibilité: var input = $ ("", {type: "hidden", nom: "mydata", valeur: "bla"}); $ ('# form1'). append ($ (entrée)); – Kote

24

Dans votre cas, il suffit d'ajouter dynamiquement un autre champ masqué à votre formulaire.

var input = $("<input>").attr("type", "hidden").val("Bla"); 
$('#form').append($(input)); 
+0

Les données que je dois soumettre ne sont pas formables. Il doit être capturé et géré du côté serveur. – Ciel

+0

Que voulez-vous dire par "ne forme pas capable"? –

+0

Désolé - cela n'a pas fonctionné du tout. Même avec des données forcées, il ne l'injecte pas dans le formulaire. – Ciel

9

Vous n'avez pas besoin de lier le soumettre événement sur le clic du bouton soumettre tout simplement lier le soumettre événement et il capturera l'événement Qu'aurions mater comment il se déclenche.

Pensez ce que vous voulez est de soumettre le triables comme vous le feriez via ajax. Essayez de faire quelque chose comme ceci:

var form = $('#event').submit(function() { 
    $.each($('#attendance').sortable('toArray'),function(i, value){ 
     $("<input>").attr({ 
      'type':'hidden', 
      'name':'attendace['+i+']' 
     }).val(value).appendTo(form); 
    }); 
}); 
+0

ne montrant toujours pas sur le côté formcollection du serveur ... est-ce qu'il y a quelque chose de spécial que je dois faire pour obtenir un champ caché pour apparaître sur un serveur? Il passe par C#/ASP.NET MVC en utilisant un objet FormCollection. – Ciel

+0

Mis à jour ma réponse, pense que je comprends ce que vous essayez de faire. – PetersenDidIt

+0

Ajoutez-vous un attribut 'name' à l'entrée du formulaire caché généré? Selon http://stackoverflow.com/questions/504681/formcollection-empty-on-form-post-in-asp-net-mvc, il semble que les objets FormCollection requièrent tous les éléments '' pour avoir des noms. – npdoty

13

Vous pouvez même utiliser celui-ci. a bien fonctionné pour moi

$("#registerform").attr("action", "register.php?btnsubmit=Save") 
$('#registerform').submit(); 

cela soumettra btnsubmit = Enregistrer comme valeur GET à register.php formulaire.

10

Vous pouvez écrire une fonction jQuery qui vous a permis d'ajouter des champs cachés à un formulaire:

// This must be applied to a form (or an object inside a form). 
jQuery.fn.addHidden = function (name, value) { 
    return this.each(function() { 
     var input = $("<input>").attr("type", "hidden").attr("name", name).val(value); 
     $(this).append($(input)); 
    }); 
}; 

Et puis ajoutez le champ caché avant de soumettre:

var frm = $("#form").addHidden('SaveAndReturn', 'Save and Return') 
        .submit(); 
+1

Voir http://stackoverflow.com/questions/2601223/jquery-add-hidden-element-to-form-programmatically/16215385#16215385 pour une version plus avancée de addHidden – Jonathan

+1

J'aime la simplicité de cette solution. Il ne gère pas beaucoup de cas, mais il gère bien le cas. – Phil

2

réponse similaire, mais je Je voulais juste le rendre disponible pour un test facile/rapide.

var input = $("<input>") 
 
       .attr("name", "mydata").val("go Rafa!"); 
 

 
$('#easy_test').append(input);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script> 
 

 

 

 
<form id="easy_test"> 
 
    
 
</form>