Cómo enviar datos con ajax jquery?
Publicado por Nicolás (8 intervenciones) el 01/12/2016 15:51:34
Tengo una página que envía una variable a otra página a través de un formulario. Esta variable es el nombre de una carpeta. En la otra página abro y leo el contenido de esa carpeta con la función glob de PHP. Necesito enviar de vuelta el resultado de esa función con ajax pero no sé como hacerlo.
pagina1.php
pagina2.php
Agradezco cualquier sugerencia.
pagina1.php
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
<!DOCTYPE HTML>
<html lang="">
<head>
<meta charset="UTF-8">
<title>página 1</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('form').submit(function(e) {
e.preventDefault();
$.ajax({
url: "pagina2.php",
type: "POST",
dataType: "HTML",
success: function( data ) {
$('body').append(data);
},
error: function(jqXHR, data ) {
alert ('Ajax request Failed.');
}
});
});
});
</script>
</head>
<body>
<div class="content">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam felis mi, pellentesque at scelerisque eu, consectetur quis felis. Aliquam mollis
</p>
</div>
<div class="form">
<!--defino variable-->
<?php
$a = "imagenes";
?>
<!--formulario para enviar variable a pagina2.php-->
<form action="pagina2.php" method="post">
<input type="hidden" name="var" value="<?php echo $a; ?>">
<input type="submit" name="submit" value="imagenes">
</form>
</div>
</body>
</html>
pagina2.php
1
2
3
4
5
6
7
8
9
10
11
12
<?php
header('Content-Type: text/html; charset=utf-8');
//tomo variable de pagina1.php
$variable = $_POST['var'];
//defino directorio
$img_dir = $variable . "/";
//funcion glob para leer imágenes de directorio
foreach(glob($img_dir . '*.jpg') as $images) {
echo '<img src="'.$img_dir.$images.'">';
}
?>
Agradezco cualquier sugerencia.
Valora esta pregunta
0