Cargar una página externa en un div con jQuery post()
Fecha Publicación:
29 de Diciembre de 2019
Fecha Modificación:
29 de Diciembre de 2019
La función de jQuery post(), su funcionalidad es la de enviar y/o cargar datos de una URL externa (HTML, PHP) de forma asíncrona (AJAX) mediante el método HTTP POST.
Esta función puede cargar una página externa en un div, id, class o similar. Es similar a las funciones de jQuery get() y load(), esta última quedó obsoleta a partir de la versión 1.8.
En definitiva con post() se puede:
- Cargar una página externa (HTML/PHP…) en un determinado div/class/etiqueta.
- Enviar parámetros con el método POST a una URL externa (Como si fuese un formulario).
- Enviar parámetros con el método POST a una URL externa y mostrar el resultado.
Sintaxis de jQuery post()
Vamos a ver la sintaxis extraída de su web oficial:
$.post(URL, parametros, funcion(datos, estado, xhr), tipoDato)
Veamos los diferentes parámetros de la función:
- URL (Obligatorio): URL que queremos obtener.
- parametros (Opcional): Son los valores que queremos enviar con método POST.
- funcion (Opcional): Función a ejecutar cuando se obtiene con éxito la URL.
– datos: Objeto devuelto con los valores de la petición POST.
– estado: Estado de la petición POST («success», «notmodified», «error», «timeout» o «parsererror»)
– xhr: Valores del objeto XMLHttpRequest. - tipoDato (Opcional): Tipo de formato devuelto por la petición (xml, html, text, script, json o jsonp).
Ejemplo para cargar una página externa con envío de parámetros:
<script type="text/javascript">
$(document).ready(function(){
$("#modulodinamico").change(function(){
$.post("paginaexterna.php",{ noperacion:'1',idmodulo:$("#modulodinamico").val(),
idpagina:$("#paginadinamica").val()},function(data){$("#secciondinam").html(data);})
});
});
</script>
Explicación del código de ejemplo:
- Al cambiar el #modulodinamico (puede ser un combo,cuadro de texto,etc).
- Cargamos la url externa 'paginaexterna.php' con el envío de parámetros:
(noperacion: «1», idmodulo: «el valor del modulodinamico», idpagina: «el valor de paginadinamica»), ejecutamos una función si no se detecta error. - Dicha función guardará el resultado en el parámetro que hemos pasado llamado ‘paginaexterna.php‘.
- El valor de ese parámetro ‘htmlexterno‘ lo cargamos en el id ‘cargaexterna‘ con la función de jQuery html().
Articulo : 1893 - Veces Leidas