JQuery - Pasar variable asincronamente con jquery

 
Vista:
sin imagen de perfil

Pasar variable asincronamente con jquery

Publicado por Manuel (4 intervenciones) el 27/10/2013 18:14:55
Hola,

Estoy usando el plugin fancybox como ventana modal.


Necesito pasar la variable $row["nombreempresa"] recogida de una base de datos dentro de un bucle while y cargar un formulario dentro de una ventana modal y que se envíe asincronamente.
No encuentro la manera de hacerlo. Llevo pillado con esto una semana.
De momento solo he conseguido pasar los datos del formulario serializando los datos pero,¿como puedo pasar a la vez $row["nombreempresa"] ?
Para ello se me ocurre poner un name que contenga dicha variable y que al hacer clic la envíe, pero no se como recogerla y enviarla mediante ajax y con los datos del formulario serializados a la vez.

Primero págino una serie de resultados:



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
while ($row = $result->fetch_assoc()) {?>
 
 
 
<div class="aladerechaflota">
	<p><a class="modalbox" href="#inline" name="<?php echo $row["nombreempresa"];?>">click to open</a></p>
 
 
<!-- hidden inline form -->
 
</div>
 
</div>
 
 
 <?php  }
 
    /* liberar el resultset */
    $result->free();
 
}
 
/* cerrar la conexión */
 
$conn->close();
 
?>
 
<div id="inline">
	<h2>Send us a Message</h2>
 
	<form id="contact" name="contact" action="#" method="post">
 
		<label for="email">Your E-mail</label>
		<input type="email" id="email" name="email" class="txt">
		<br>
		<label for="msg">Enter a Message</label>
		<textarea id="msg" name="msg" class="txtarea"></textarea>
 
		<button id="send">Send E-mail</button>
	</form>
</div>

El script que valida el formulario y pasa los datos a send_email.php es el 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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
function validateEmail(email) {
		var reg = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
		return reg.test(email);
	}
 
	$(document).ready(function() {
		$(".modalbox").fancybox();
		$("#contact").submit(function() { return false; });
 
 
		$("#send").on("click", function(){
			var emailval  = $("#email").val();
			var msgval    = $("#msg").val();
			var msglen    = msgval.length;
			var mailvalid = validateEmail(emailval);
 
			if(mailvalid == false) {
				$("#email").addClass("error");
			}
			else if(mailvalid == true){
				$("#email").removeClass("error");
			}
 
			if(msglen < 4) {
				$("#msg").addClass("error");
			}
			else if(msglen >= 4){
				$("#msg").removeClass("error");
			}
 
			if(mailvalid == true && msglen >= 4) {
				// if both validate we attempt to send the e-mail
				// first we hide the submit btn so the user doesnt click twice
				$("#send").replaceWith("<em>sending...</em>");
 
				$.ajax({
					type: 'POST',
					url: 'includes/send_email.php',
					data: $("#contact").serialize(),
					success: function(data) {
						if(data == "true") {
							$("#contact").fadeOut("fast", function(){
								$(this).before("<p><strong>Success! Your feedback has been sent, thanks :)</strong></p>");
								setTimeout("$.fancybox.close()", 1000);
							});
						}
					}
				});
			}
		});
	});

El archivo sendemail.php el cual envía el formulario y devuelve la respuesta es:

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
<?php
$sendto   = "youremail@youremail.com";
$usermail = $_POST['email'];
$content  = nl2br($_POST['msg']);
 
$subject  = "New Feedback Message";
$headers  = "From: " . strip_tags($usermail) . "\r\n";
$headers .= "Reply-To: ". strip_tags($usermail) . "\r\n";
$headers .= "MIME-Version: 1.0\r\n";
$headers .= "Content-Type: text/html;charset=utf-8 \r\n";
 
$msg  = "<html><body style='font-family:Arial,sans-serif;'>";
$msg .= "<h2 style='font-weight:bold;border-bottom:1px dotted #ccc;'>New User Feedback</h2>\r\n";
$msg .= "<p><strong>Sent by:</strong> ".$usermail."</p>\r\n";
$msg .= "<p><strong>Message:</strong> ".$content."</p>\r\n";
$msg .= "</body></html>";
 
 
if(@mail($sendto, $subject, $msg, $headers)) {
	echo "true";
} else {
	echo "false";
}
 
?>

Gracias de antemano por la atención prestada.


Manuel
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
sin imagen de perfil

Pasar variable asincronamente con jquery

Publicado por Jesus Gabriel (2 intervenciones) el 28/10/2013 17:16:12
bueno mi estimado podrias hacerlo de esta forma

asi como pintas el nombreempresa en tu ancla

con jquery tomas el name y lo pintas en un input de tipo hidden en tu formulario.

ejemplo de como lo haria basandome en tu codigo.
esto es para tomar el name que creas y meterlo en un input hidden en el formulario el nombre que le pongo como id tu le puedes colocar cualquiera.

1
2
3
4
$(".modalbox").click(function(){
          var nombreEmpresa = $(this).attr("name");
           $("#unInput-de-tipo-hidden-en-el-formulario").val(nombreEmpresa);
});

Con esto ya tienes dentro de tu form el dato de la empresa y al enviarlo serializado, tomas la variable como culquier otra de las que tienes ahi.


espero te sirva.


saludos

saludos
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
sin imagen de perfil

Pasar variable asincronamente con jquery

Publicado por Manuel (4 intervenciones) el 28/10/2013 23:41:44
Genial, funciona!

Gracias por el cable me tenía muy rallado, intuía que había que pasarle los datos a un input hidden pero no sabia como se le pasaban esos datos desde jquery.

Una única pregunta cuando se le pasan de ésta manera los datos a un input hidden se puede considerar que es asíncronamente o no?

Al input hidden lo identifique como empresa y a su name de la igual manera luego recogí los datos serializados:

$empresa = $_POST['empresa'];
$usermail = $_POST['email'];
$content = nl2br($_POST['msg']);


Gracias de nuevo,

Pongo el código de la función de jquery para que todo el mundo pueda ver como queda:

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
48
49
50
51
52
53
54
55
56
57
function validateEmail(email) {
		var reg = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
		return reg.test(email);
	}
 
	$(document).ready(function() {
		$(".modalbox").fancybox();
 
		$(".modalbox").click(function(){
var nombreEmpresa = $(this).attr("name");
$("#empresa").val(nombreEmpresa);
});
 
		$("#contact").submit(function() { return false; });
 
 
		$("#send").on("click", function(){
			var emailval  = $("#email").val();
			var msgval    = $("#msg").val();
			var msglen    = msgval.length;
			var mailvalid = validateEmail(emailval);
 
			if(mailvalid == false) {
				$("#email").addClass("error");
			}
			else if(mailvalid == true){
				$("#email").removeClass("error");
			}
 
			if(msglen < 4) {
				$("#msg").addClass("error");
			}
			else if(msglen >= 4){
				$("#msg").removeClass("error");
			}
 
			if(mailvalid == true && msglen >= 4) {
				// if both validate we attempt to send the e-mail
				// first we hide the submit btn so the user doesnt click twice
				$("#send").replaceWith("<em>sending...</em>");
 
				$.ajax({
					type: 'POST',
					url: 'includes/send_emailformfancy.php',
					data: $("#contact").serialize(),
					success: function(data) {
						if(data == "true") {
							$("#contact").fadeOut("fast", function(){
								$(this).before("<p><strong>Success! Your feedback has been sent, thanks :)</strong></p>");
								setTimeout("$.fancybox.close()", 1000);
							});
						}
					}
				});
			}
		});
	});
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