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

¿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


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

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.


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();

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

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>

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.