JQuery - Id dinamico Jquery,Ajax y PHP

 
Vista:

Id dinamico Jquery,Ajax y PHP

Publicado por Diego (10 intervenciones) el 30/11/2014 01:25:57
Buenas noches, quisiera hacer una consulta sobre capturar Id Dinamicamente con Jquery.
El tema es el siguiente, a travez de una consulta a MySql imprimo una serie de datos, cada uno en un formulario, dentro de ese formulario hago un input submit para enviar a otro lugar a travez de ajax para que no recargue la pagina.
Lo que quiero es que una vez enviado me elimine el boton de enviado pero nose como hacerlo... tengo lo siguiente

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
$(document).ready(function() {
	$().ajaxStart(function() {
		$('#loading').show();
		$('#result').hide();
	}).ajaxStop(function() {
		$('#loading').hide();
		$('#result').fadeIn('slow');
	});
	$('#form, #fat, #fo3').submit(function() {
		$.ajax({
			type: 'POST',
			url: 'pedido.php',
			data: $(this).serialize(),
			success: function(data) {
 
 
                                        //este seria el codigo que borra el boton npero que no lo hace, (si lo coloco fuera,  debajo del return si lo hace pero me lo borra aunque uno de los campos del formulario este mal)
				$('input[id^="enviar"]').click(function(){
					var id = $(this).css('display','none');
				});
 
			}
		})
		return false;
	});
})

MySql
1
2
3
4
5
6
7
8
echo "<form action='' method='' enctype='multipart/form-data' id='fo3' name='fo3'>";
echo "
<tr> 
<td width='150'><input type='text' id='cantidad' name='cantidad' placeholder='Cantidad' required></td>  
<td width='150'><input type='text' id='talle' name='talle' placeholder='Talles'></td>  
<td width='150'><input type='submit' name='enviar' id='enviar' class='agregar' value='Agregar a la Lista'><div id='message'></div></td>
</tr>";
echo "</form>";

Espero que se entienda lo que deseo hacer.. muchas gracias
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve
Val: 302
Oro
Ha mantenido su posición en JQuery (en relación al último mes)
Gráfica de JQuery

Id dinamico Jquery,Ajax y PHP

Publicado por xve (673 intervenciones) el 30/11/2014 19:04:01
Hola Diego, viendo tu código, creo que seria algo como:
1
$("#enviar").hide();
dentro del succes...

Coméntanos si es esto lo que buscas, ok?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Id dinamico Jquery,Ajax y PHP

Publicado por Diego (10 intervenciones) el 30/11/2014 19:16:00
Como estas? Gracias por responderme.. bueno eso es lo que busco que pase, lo que me olvide y pido disculpas..
la consulta mysql esta hecha en un while

1
2
3
4
5
6
7
8
9
10
while($reg=mysqli_fetch_array($registro1)){
echo "<form action='' method='' enctype='multipart/form-data' id='fo3' name='fo3'>";
echo "
<tr> 
<td width='150'><input type='text' id='cantidad' name='cantidad' placeholder='Cantidad' required></td>  
<td width='150'><input type='text' id='talle' name='talle' placeholder='Talles'></td>  
<td width='150'><input type='submit' name='enviar' id='enviar' class='agregar' value='Agregar a la Lista'><div id='message'></div></td>
</tr>";
echo "</form>";
}

Entonces lo que me pasa es que no puedo capturar dinamicamente el id del enviar, porque o me borra uno o me borra todos, si a la primera funcion que puse de jquery coloco:

1
2
3
$('input[id^="enviar"]').click(function(){
    var id = $(this).css('display','none');
});

fuera del .ajax, me lo borra aunque no envie el formulario
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de xve
Val: 302
Oro
Ha mantenido su posición en JQuery (en relación al último mes)
Gráfica de JQuery

Id dinamico Jquery,Ajax y PHP

Publicado por xve (673 intervenciones) el 30/11/2014 21:30:53
Hola Diego, si es así, tienes que hacer referencia al objeto $(this) para esconder el botón de dicho formulario...

Algo así:
1
$(this).find("input[type=submit]").hide();

Coméntanos si te sirve, ok?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Id dinamico Jquery,Ajax y PHP

Publicado por Diego (10 intervenciones) el 01/12/2014 00:29:14
Muchas gracias! lo he probado pero no resulta... o nose como ponerlo je! Igual sigo probando y te mantengo al tanto, muchas gracias por la ayuda
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Id dinamico Jquery,Ajax y PHP

Publicado por Diego (10 intervenciones) el 01/12/2014 22:35:44
He llegado con este código, pero no lo oculta:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
$(document).ready(function() {
				$().ajaxStart(function() {
					$('#loading').show();
					$('#result').hide();
				}).ajaxStop(function() {
					$('#loading').hide();
					$('#result').fadeIn('slow');
				});
				$('.form').submit(function(e) {
					e.preventDefault();
					$this = $(this);
					$.ajax({
						type: 'POST',
						url: 'pedido.php',
						data: $(this).serialize(),
						success: function(data) {
							$this.find('input[type=submit]').hide();
						}
					})
					return false;
				});
			})

Nose porque, que estara fallando
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Id dinamico Jquery,Ajax y PHP

Publicado por Diego (10 intervenciones) el 01/12/2014 23:06:23
Bueno he dado con el resultado al menos por ahora, je, lo seguire probando... al codigo quepuse le agrege $this.parent().find("input[type=submit]").hide();
Lo busque por otro foro (http://translate.googleusercontent.com/translate_c?depth=1&hl=es&prev=search&rurl=translate.google.com.ar&sl=en&u=http://stackoverflow.com/questions/5028605/jquery-this-find-not-working&usg=ALkJrhgzLL5keJM2PaR--dJBJ1gaKo-zyQ)
De JQuery nose mucho, y veo que tengo que ponerme a estudiar sobre el tema.. una vez agregado eso lo que hice fue cambiar las etiquetas <tr> de lugar y las puse por encima del <form>...
antes estaban asi:

1
2
3
4
5
6
7
8
9
while($reg=mysqli_fetch_array($registro1)){
echo "<form action='' method='' enctype='multipart/form-data' id='fo3' name='fo3'>";
echo "
<tr> 
<td width='150'><input type='text' id='cantidad' name='cantidad' placeholder='Cantidad' required></td> 
<td width='150'><input type='text' id='talle' name='talle' placeholder='Talles'></td> 
<td width='150'><input type='submit' name='enviar' id='enviar' class='agregar' value='Agregar a la Lista'><div id='message'></div></td>
</tr>";
echo "</form>";

ahora:

1
2
3
4
5
6
7
8
9
while($reg=mysqli_fetch_array($registro1)){
echo "<tr>";
echo "<form action='' method='' enctype='multipart/form-data' id='fo3' name='fo3'>";
echo "

<td width='150'><input type='text' id='cantidad' name='cantidad' placeholder='Cantidad' required></td> 
<td width='150'><input type='text' id='talle' name='talle' placeholder='Talles'></td> 
<td width='150'><input type='submit' name='enviar' id='enviar' class='agregar' value='Agregar a la Lista'><div id='message'></div></td>";
echo "</form>";echo</tr>";

Porque haria eso, porque lo que buscaba es el type=submit despues de la clase .form pero pero el submit que estaba dentro de la etiqueta <td> no es hijo de .form es hijo de <tr> por ende tenia que poner el <td> como hijo de .form...

el Jquery quedaria asi

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
$(document).ready(function() {
$().ajaxStart(function() {
$('#loading').show();
$('#result').hide();
}).ajaxStop(function() {
$('#loading').hide();
$('#result').fadeIn('slow');
});
$('.form').submit(function(e) {
e.preventDefault();
$this = $(this);
$.ajax({
type: 'POST',
url: 'pedido.php',
data: $(this).serialize(),
success: function(data) {
$('#agregado').show(1000);
setTimeout(function() {
$("#agregado").fadeOut(1500);
},2000);
$this.parent().find('input[class^="agregar"]').hide();
}
})
return false;
});
})

Como dije no soy un especializado en el tema de jquery asique si llegase a estar mal explicado y alguien lo puede explicar mejor estaria bueno que lo explique, este fue mi razonamiento desde mi logica.. jeje
Asi logro ocultar el boton

Muchas gracias por la ayuda y por el tiempo..

Saludos!!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
Imágen de perfil de xve
Val: 302
Oro
Ha mantenido su posición en JQuery (en relación al último mes)
Gráfica de JQuery

Id dinamico Jquery,Ajax y PHP

Publicado por xve (673 intervenciones) el 02/12/2014 08:57:25
Gracias por compartirlo Diego!!!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar