jQuery: agrega parámetros adicionales al enviar (NO ajax)

206

Usando el 'envío' de jQuery, ¿hay alguna manera de pasar parámetros adicionales a un formulario? NO estoy buscando hacer esto con Ajax: este es un envío de formulario normal y típico de actualización.

$('#submit').click(function () {
    $('#event').submit(function () {
        data: { 
        form['attendees'] = $('#attendance').sortable('toArray').toString();
    });
});
Ciel
fuente
¿Qué tecnología del lado del servidor estás usando?
Enrique
Vea mi respuesta [aquí] [1], que se adjunta a un formulario serializado antes de enviarlo. [1]: stackoverflow.com/questions/17809056/…
Jeff Lowery

Respuestas:

371

Este lo hizo por mí:

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

se basa en la respuesta de Daff, pero agregó el atributo NAME para que se muestre en la colección de formularios y cambió VALUE a VAL También verificó la ID del FORMULARIO (form1 en mi caso)

usó el Firebug de Firefox para verificar si el elemento fue insertado.

Los elementos ocultos se vuelven a publicar en la colección de formularios, solo se descartan los campos de solo lectura.

Michel

Michel
fuente
46
¿Cómo canto 'you are my sunshine' en binario? Muchas gracias. Esto resuelve muchas cosas.
Ciel
38
Puede mejorar ligeramente la legibilidad: var input = $ ("<input>", {type: "hidden", name: "mydata", value: "bla"}); $ ('# form1'). append ($ (input));
Konstantine Kalbazov
2
$ ("<input>") .attr ("type", "hidden"). attr ("name", "mydata"). val ("bla"). appendTo ('# form1'); es otra manera
Kiev
66
Me gustó un combo de: $ ("<input>", {type: "hidden", name: "mydata", value: "bla"}). AppendTo ("# form1");
gabeio
¿No hay un límite en el tamaño de los datos? Envié algún objeto grande usando JSON.stringify (obj) y este método y parecía estar truncado.
omikron
26

En su caso, debería ser suficiente agregar otro campo oculto a su formulario dinámicamente.

var input = $("<input>").attr("type", "hidden").val("Bla");
$('#form').append($(input));
Narciso
fuente
Los datos que necesito enviar no tienen capacidad para formularios. Tiene que ser capturado y manejado en el lado del servidor.
Ciel
¿Qué quiere decir con "no capaz de forma"?
Vincent Ramdhanie
Lo siento, esto no funcionó en absoluto. Incluso con datos forzados, no los inyecta en el formulario.
Ciel
No se puede colocar en un campo de formulario.
Ciel
2
Si es una cadena de caracteres que se puede poner en un campo de formulario
PetersenDidIt
19

Incluso puedes usar este. funcionó bien para mí

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

esto enviará btnsubmit = Guardar como valor GET al formulario register.php.

Parag
fuente
Esto parece una solución más elegante. Solo recuerde usar encodeURIComponent()el valor del parámetro según el tipo de datos.
Andres SK
1
Este es realmente mejor cuando permite que el usuario envíe el formulario varias veces. El formulario no obtendrá más de un campo oculto con valores diferentes.
Mellon
11

Podría escribir una función jQuery que le permitiera agregar campos ocultos a un formulario:

// 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));
    });
};

Y luego agregue el campo oculto antes de enviar:

var frm = $("#form").addHidden('SaveAndReturn', 'Save and Return')
                    .submit();
Jonathan
fuente
1
Consulte stackoverflow.com/questions/2601223/… para obtener una versión más avanzada de addHidden
Jonathan el
1
Me gusta la simplicidad de esta solución. No maneja muchos casos, pero maneja muy bien el caso que lo hace.
Phil
11

No es necesario vincular el evento de envío al hacer clic en el botón de envío, solo se vincula el evento de envío y capturará el evento de envío sin importar cómo se desencadena.

Piensa que lo que quieres es enviar el ordenamiento como lo harías a través de ajax. Intenta hacer algo como esto:

var form = $('#event').submit(function () {
    $.each($('#attendance').sortable('toArray'),function(i, value){
        $("<input>").attr({
            'type':'hidden',
            'name':'attendace['+i+']'
        }).val(value).appendTo(form);
    });
});
PetersenDidIt
fuente
todavía no se muestra en el lado del servidor formcollection ... ¿hay algo especial que deba hacer para que un campo oculto aparezca en un servidor? Está pasando por C # / ASP.NET MVC usando un objeto FormCollection.
Ciel
Actualicé mi respuesta, creo que entiendo lo que estás tratando de hacer.
PetersenDidIt
¿Está agregando un nameatributo a la entrada de formulario oculta generada? Según stackoverflow.com/questions/504681/… parece que los objetos FormCollection requieren que todos los <input>elementos tengan nombres.
npdoty
Sí, estoy tratando de insertar un ordenable en la colección de formularios como una cadena de valores separados por comas. He intentado su actualización y todavía no se publica. No estoy seguro de lo que estoy haciendo mal ... Agradezco la ayuda.
Ciel
Parece que el problema no está del lado del cliente sino del lado del servidor.
PetersenDidIt
2

Respuesta similar, pero solo quería que estuviera disponible para una prueba fácil / rápida.

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>

Cacho Santa
fuente