Ver Mensaje Individual
  #1 (permalink)  
Antiguo 04/12/2008, 07:59
Avatar de ZiTAL
ZiTAL
 
Fecha de Ingreso: marzo-2004
Ubicación: Bermio (Bizkaia)
Mensajes: 1.545
Antigüedad: 20 años, 8 meses
Puntos: 62
De acuerdo libreria para ajax

Aupa aspaldikos, hace tiempo que no escribo en este sub-foro en concreto y quiero postear la clase / libreria o como querais llamarle que he estado haciendo durante estos 2 dias:

ajax.js

Código javascript:
Ver original
  1. var ajax = function()
  2. {
  3.     this.page; // page to request the petition, default: the same page (window.location)
  4.     this.method; // ajax method: post or get, post by default
  5.     this.charset; // charset utf-8 by default
  6.     this.response; // response method, XML or Text, Text by default
  7.     this.query; // GET or POST query separated by & blank for default
  8.     this.async; // ajax connection method, true by default (firefox needs true to work)
  9.     this.getSeparator; // pagename and parameters separator ? by default
  10.    
  11.     // request public method
  12.     ajax.prototype.request = function()
  13.     {              
  14.         var a = new xmlhttp(); // get xmlhttp object
  15.         if(a) // if browser support ajax
  16.         {
  17.             var t = this;
  18.             setDefault.call(this); // set default properties
  19.             var b = headers(t.method, t.charset); // set get/post different headers
  20.             petitionConstruct.call(this); // construct get/post different properties
  21.            
  22.             t.loading(); // Loading method ON
  23.             a.open(t.method,t.page,t.async); // open ajax petition
  24.             a.setRequestHeader('Content-Type', b); // set headers ALWAYS after OPEN
  25.             a.onreadystatechange = function() // get petition changestates
  26.             {
  27.                 switch(a.readyState)
  28.                 {
  29.                     case 4: // if changestate is 4 the request is complete
  30.                         if(a.status==200) // if status is 200 petition OK
  31.                         {
  32.                             if(t.response.toLowerCase()=='xml') // if XML response get XML
  33.                                 t.complete(a.responseXML);  // execute complete method                     
  34.                             else // else get plain text
  35.                                 t.complete(a.responseText); // execute complete method
  36.                         }
  37.                         else
  38.                             t.error(); // if error occurred execute error method
  39.                         break;         
  40.                 }
  41.             };
  42.             a.send(t.query);    // send get/post query 
  43.         }
  44.         else
  45.             alert('Your browser doesn\'t support ajax');
  46.     };                 
  47.  
  48.     // public methods to redefine
  49.     ajax.prototype.loading = function(){};     
  50.     ajax.prototype.complete = function(t){};
  51.     ajax.prototype.error = function(){};                       
  52.    
  53.     // private method to set default properties
  54.     var setDefault = function()
  55.     {
  56.         if(!this.method) this.method='post';               
  57.         if(!this.page) this.page=window.location;
  58.         if(!this.async) this.async=true;                   
  59.         if(!this.charset) this.charset='utf-8';
  60.         if(!this.response) this.response='txt';                            
  61.         if(!this.query) this.query='';
  62.         if(!this.getSeparator) this.getSeparator='?';
  63.     }; 
  64.    
  65.     // private method to set get/post headers
  66.     var headers = function(m, c)
  67.     {
  68.         var a = '';
  69.         if(m.toLowerCase()=='post')
  70.             a = a + "application/x-www-form-urlencoded;"; // post Header
  71.         a = a + "charset="+c;
  72.         return a;
  73.     };                             
  74.  
  75.     // private method set get/post petition properties
  76.     var petitionConstruct = function()
  77.     {
  78.         // DEFAULT POST example page = index.php and query = a=hello, php -> $_POST['hello']
  79.         if(this.method!='post')// GET example page = index.php?a=hello and query = '', php -> $_GET['hello']
  80.         {
  81.             this.page = this.page+this.getSeparator+this.query;
  82.             this.query = '';
  83.         }
  84.     };
  85.    
  86.     // private method get xmlhttp object
  87.     var xmlhttp = function()
  88.     {
  89.         var a;try{a = new XMLHttpRequest();}
  90.         catch(e){try{a = new ActiveXObject('Msxml2.XMLHTTP');}
  91.         catch(e){try{a = new ActiveXObject('Microsoft.XMLHTTP');}
  92.         catch(e){a=false;}}}return a;
  93.     };     
  94. };

Un ejemplo de uso sería:

index.php
Código PHP:
<?php
        
if($_GET['a']=='a')
        {
            echo 
"GET: AAAAAAAAAAAAAAAAAAAAAAAAAAA";
            exit();
        }
        elseif(
$_POST['a']=='a')
        {
            echo 
"POST: AAAAAAAAAAAAAAAAAAAAAAAAAAA";
            exit();
        }        
?>
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="es" xml:lang="es">
<head>
<title>YEAH</title>
<script type="text/javascript" src="js/ajax.js">
</script>
<script type="text/javascript" src="js/main.js"></script>
</head>
<body>
	<div id="post">post content</div>
	<div id="get">get content</div>		
</body>
</html> 
main.js

Código javascript:
Ver original
  1. window.onload = function()
  2.     {
  3.         // simple EXAMPLE: POST
  4.         var b = new ajax();
  5.         b.query = 'a=a';
  6.        
  7.         b.loading = function()
  8.         {
  9.             var a = document.getElementById('post').innerHTML='loading...';
  10.         };
  11.         b.complete = function(t)
  12.         {
  13.             window.setTimeout(function()
  14.                 {  
  15.                     var a = document.getElementById('post').innerHTML=t;           
  16.                 }, 1500
  17.             );
  18.         };
  19.         b.error = function()
  20.         {
  21.             alert('Error POST petition');
  22.         };     
  23.         b.request();
  24.        
  25.         // advance example GET
  26.         var c = new ajax();
  27.         c.page = 'index.php';
  28.         c.method = 'get';
  29.         c.charset = 'utf-8';
  30.         c.response = 'txt';
  31.         c.query = 'a=a';
  32.         c.async = true;
  33.         c.getSeparator = '?';
  34.        
  35.         c.loading = function()
  36.         {
  37.             var a = document.getElementById('get').innerHTML='loading...';
  38.         };
  39.         c.complete = function(t)
  40.         {
  41.             window.setTimeout(function()
  42.                 {  
  43.                     var a = document.getElementById('get').innerHTML=t;        
  44.                 }, 3000
  45.             );
  46.         };
  47.         c.error = function()
  48.         {
  49.             alert('Error GET petition');
  50.         };             
  51.         c.request();       
  52.     };
__________________
http://zital.no-ip.org
____________________

Euskerie ahuen eta bijotzan