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.