sábado, 25 de junio de 2011

JQUERY. Uso de función .get de la forma $.get(URL, datos, funcion, tipo_dato_respuesta)

Información tomada de :


El Ejemplo desarrollado es de la forma $.get(URL, datos, funcion, tipo_dato_respuesta); donde el tipo_de_dato es el tipo que se espera recibir como respuesta del servidor. Lo típico es que del servidor nos llegue un código HTML, pero también podría ser un XML, un script o un JSON.

Ejemplo:

dos.html

<html>
<head>
   <title>REROES - Ajax Simple</title>
    <script src="jquery-1.6.min.js" type="text/javascript"></script>   
<script>
$(document).ready(function(){
    
    $("#verificardatos").click(function(){
        var nombres = $("#caja_nombre").val();
        var apellidos = $("#caja_apellido").val();
        var cedula = $("#caja_cedula").val();
        var edad = $("#caja_edad").val();

        $.get("recibe-parametros-devuelve-json.php", {nombres: nombres, apellidos: apellidos, cedula:cedula , edad:edad}, muestraInformacion, "json");
    })
    

    function muestraInformacion(respuesta){
        $("#base").html("<h2>Datos Obtenidos</h2>");
        $("#base").append($('<br/><span class="clienteext">'+respuesta.nombres+' '+respuesta.apellidos+' con cedula '+ respuesta.cedula+'</span>'));

        if (respuesta.tipo == "me"){
            $("#base").css("background-color", "#blue");
            $("#base").append($('<br/><h3 class="clienteext"> Edad  :'+respuesta.edad+'  menor de edad</h3>'));

        }else{
            $("#base").css("background-color", "#red");
            $("#base").append($('<br/><h3 class="clienteext"> Edad  :'+respuesta.edad+'  mayor de edad</h3>'));
        }
    }

})
</script>
</head>
<body>
   <h3>Segunda prueba de Ajax con JQUERY:</h3>

    <div>
        Cedula: <input type="text" id="caja_cedula" name="fcedula" /><br />
        Nombres: <input type="text" id="caja_nombre" name="fname" /><br />
        Apellidos: <input type="text" id="caja_apellido" name="lname" /><br />
        Edad: <input type="text" id="caja_edad" name="fedad" /><br />
 
        <button id="verificardatos">verificar datos</button>
        <br/>
    </div>
    
<br>
<div id="base"></div>

</body>
</html>

recibe-parametros-devuelve-json.php

if ((int)$_GET["edad"]<18){
   echo json_encode(array("nombres"=>$_GET["nombres"], "apellidos"=>$_GET["apellidos"], "cedula"=>$_GET["cedula"], "tipo"=>"me", "edad"=>$_GET["edad"]));
}else{
   echo json_encode(array("nombres"=>$_GET["nombres"], "apellidos"=>$_GET["apellidos"], "cedula"=>$_GET["cedula"], "tipo"=>"ma", "edad"=>$_GET["edad"]));
}
?>

1 comentario:

Con la tecnología de Blogger.

Lema

El mejor hábito.... la lectura..

Buscar

BTemplates.com

BTemplates.com

Blogroll

Datos personales

Blogroll

About