Ajax con la función get de Jquery
Al igual que podemos enviar datos mediante post, con jquery también es posible hacerlo con get, el procedimiento es el mismo, es decir, enviar la consulta y recibir una respuesta ajax, salvo las diferencias que separa tanto al método post como al get, en este caso una petición HTTP get request enviando los parámetros a través de la URL.
En el siguiente ejemplo realizaremos una petición get mediante un formulario ubicado en el index.php, esta petición se hará al archivo ajax.php que nos regresará la respuesta Ajax de la consulta.
index.php
<!-- By http://jquery-manual.blogspot.com -->
<!DOCTYPE HTML>
<html>
<head>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.7.2.min.js'></script>
<script type="text/javascript">
$(document).ready(function() {
$(":button#boton").click(function() {
var campo1_val = $("#campo1").val();
var campo2_val = $("#campo2").val();
$.get("ajax.php", {campo1: campo1_val, campo2: campo2_val}, function(data) {
$("#caja").html("<p>Contenido Cargado ...</p>" + data);
});
});
});
</script>
</head>
<body>
<form method="get">
<input type="text" id="campo1" placeholder="introduce algo">
<input type="text" id="campo2" placeholder="introduce algo">
<input type="button" id="boton" value="GET()">
</form>
<div id="caja" class="caja"></div>
</body>
</html>
ajax.php
<?php $campo1 = $_GET["campo1"]; $campo2 = $_GET["campo2"]; echo "<p>Campo 1: " . $campo1 . "</p>"; echo "<p>Campo 2: " . $campo2 . "</p>"; ?>
No hay comentarios:
Publicar un comentario