Código de JQuery - Enviar formularios independientes en jquery

Imágen de perfil
Val: 265
Plata
Ha mantenido su posición en JQuery (en relación al último mes)
Gráfica de JQuery

Enviar formularios independientes en jquerygráfica de visualizaciones


JQuery

estrellaestrellaestrellaestrellaestrella(1)
Publicado el 6 de Agosto del 2016 por Vainas
1.682 visualizaciones desde el 6 de Agosto del 2016
Si tienes varios formularios en una web y quieres subir cada uno independientemente. Es solo agregar una clase a todos los formularios y utilizar dentro del submit el elemento this para obtener el formulario y despues usar serialize o serializeArray para obtener los valores de inputs dentro de mismo.

Dejo el codigo funciona aqui: https://jsfiddle.net/p8ch3uka/

Requerimientos

Es necesario tener jquery. https://jquery.com/download/
He agregado esta libreria para poder visualizar los resultados de console.log dentro de la propia web https://github.com/bahmutov/console-log-div

1.0
estrellaestrellaestrellaestrellaestrella(1)

Publicado el 6 de Agosto del 2016gráfica de visualizaciones de la versión: 1.0
1.683 visualizaciones desde el 6 de Agosto del 2016
estrellaestrellaestrellaestrellaestrella
estrellaestrellaestrellaestrella
estrellaestrellaestrella
estrellaestrella
estrella

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
        <!-- incluir aqui libreria jquery -->
<script>
$( document ).ready(function() {
    $('.formularios').submit(function(event){
    	event.preventDefault();
      var serializado = $(this).serialize();
      var objeto = $(this).serializeArray();
      console.log(serializado);
      console.log(objeto);
      $(this).css("background-color", "#ECF8E0");
    });
});
</script>
</head>
<body>
<form action="" method="post" class="formularios" id="listado1">
		<input type="hidden" name="oculto1" value="nombre-apellido-1"/>
        <div>Nombre 1</div>
        <div>Apellido 1</div>
		<input type="radio" value="1" name="radio1" id="i1" />
		<input type="radio" value="0.25" name="radio1" id="i2" />
		<input type="radio" value="0.5" name="radio1" id="i3"/>
		<input type="radio" value="0.25" name="radio1" id="i4"/>
		<input type="radio" value="0.5" name="radio1" id="i5"/>
        <input type="submit" name="Actualizar"/>
	</form>
<form action="" method="post" class="formularios" id="listado2">
	<input type="hidden" name="oculto2" value="nombre-apellido-2"/>
    <div>Nombre 2</div>
    <div>Apellido 2</div>
		<input type="radio" value="1" name="radio2" id="i1" />
		<input type="radio" value="0.25" name="radio2" id="i2" />
		<input type="radio" value="0.5" name="radio2" id="i3"/>
		<input type="radio" value="0.25" name="radio2" id="i4"/>
		<input type="radio" value="0.5" name="radio2" id="i5"/>
    <input type="submit" name="Actualizar"/>
</form>
 
<fieldset id="console-log-div"></fieldset>
<script src="https://rawgit.com/bahmutov/console-log-div/master/console-log-div.js"></script>
</body>
</html>



Comentarios sobre la versión: 1.0 (1)

Imágen de perfil
6 de Agosto del 2016
estrellaestrellaestrellaestrellaestrella
Muy bueno Vainas!!!
Responder

Comentar la versión: 1.0

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios
Es necesario revisar y aceptar las políticas de privacidad

http://lwp-l.com/s3622