No se muestra datos php y ajax

hans2488 · #1 (**permalink**) 08/05/2013, 10:28

Hola compañeros estoy queriendo aprender lo que es php con ajax, estoy siguiento este tutorial el cual muestra todos los pasos y los archivos de hacerlos

Código:

http://www.tutorialspoint.com/php/php_and_ajax.htm

Pero al querer hacerlo correr en localhost no funciona nada ya cambie las conexiones y segun el tutorial deberia funcionar todo bien, cual puede ser el problema??
Mis archivos ajax.html

Código HTML:

<html>
<body>
<script language="javascript" type="text/javascript">
<!-- 
//Browser Support Code
function ajaxFunction(){
 var ajaxRequest;  // The variable that makes Ajax possible!
	
 try{
   // Opera 8.0+, Firefox, Safari
   ajaxRequest = new XMLHttpRequest();
 }catch (e){
   // Internet Explorer Browsers
   try{
      ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
   }catch (e) {
      try{
         ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
      }catch (e){
         // Something went wrong
         alert("Your browser broke!");
         return false;
      }
   }
 }
 // Create a function that will receive data 
 // sent from the server and will update
 // div section in the same page.
 ajaxRequest.onreadystatechange = function(){
   if(ajaxRequest.readyState == 4){
      var ajaxDisplay = document.getElementById('ajaxDiv');
      ajaxDisplay.value = ajaxRequest.responseText;
   }
 }
 // Now get the value from user and pass it to
 // server script.
 var age = document.getElementById('age').value;
 var wpm = document.getElementById('wpm').value;
 var sex = document.getElementById('sex').value;
 var queryString = "?age=" + age ;
 queryString +=  "&wpm=" + wpm + "&sex=" + sex;
 ajaxRequest.open("GET", "ajax-example.php" + queryString, true);
 ajaxRequest.send(null); 
}
//-->
</script>
<form name='myForm'>
Max Age: <input type='text' id='age' /> <br />
Max WPM: <input type='text' id='wpm' />
<br />
Sex: <select id='sex'>
<option value="m">m</option>
<option value="f">f</option>
</select>
<input type='button' onclick='ajaxFunction()' value='Query MySQL'/>
</form>
<div id='ajaxDiv'>Your result will display here</div>
</body>
</html>

ajax-example.php

Código PHP:

  <?php 
$dbhost = "localhost"; 
$dbuser = "root"; 
$dbpass = "vertrigo"; 
$dbname = "ajax_buscador"; 
    //Connect to MySQL Server 
mysql_connect($dbhost, $dbuser, $dbpass); 
    //Select Database 
mysql_select_db($dbname) or die(mysql_error()); 
    // Retrieve data from Query String 
$age = $_GET['age']; 
$sex = $_GET['sex']; 
$wpm = $_GET['wpm']; 
    // Escape User Input to help prevent SQL Injection 
$age = mysql_real_escape_string($age); 
$sex = mysql_real_escape_string($sex); 
$wpm = mysql_real_escape_string($wpm); 
    //build query 
$query = "SELECT * FROM ajax_example WHERE sex = '$sex'"; 
if(is_numeric($age)) 
    $query .= " AND age <= $age"; 
if(is_numeric($wpm)) 
    $query .= " AND wpm <= $wpm"; 
    //Execute query 
$qry_result = mysql_query($query) or die(mysql_error()); 
 
    //Build Result String 
$display_string = "<table>"; 
$display_string .= "<tr>"; 
$display_string .= "<th>Name</th>"; 
$display_string .= "<th>Age</th>"; 
$display_string .= "<th>Sex</th>"; 
$display_string .= "<th>WPM</th>"; 
$display_string .= "</tr>"; 
 
// Insert a new row in the table for each person returned 
while($row = mysql_fetch_array($qry_result)){ 
    $display_string .= "<tr>"; 
    $display_string .= "<td>$row[name]</td>"; 
    $display_string .= "<td>$row[age]</td>"; 
    $display_string .= "<td>$row[sex]</td>"; 
    $display_string .= "<td>$row[wpm]</td>"; 
    $display_string .= "</tr>"; 
     
} 
echo "Query: " . $query . "<br />"; 
$display_string .= "</table>"; 
echo $display_string; 
?>

repara2 · #2 (**permalink**) 08/05/2013, 11:08

Utiliza la consola de Firebug para obtener el error y desde allí puedes continuar.
Salu2

hans2488 · #3 (**permalink**) 08/05/2013, 11:50

Segun pude ver en modo consola si se procesan los datos y muestra los resultados, pero el problema es que no sale esos resultados en pantalla, cual podria ser el problema??

hans2488 · #4 (**permalink**) 08/05/2013, 14:48

Habilite javascript modifique el codigo y nada, debe ser alguna pequeñez q no logro ubicarlo espero me brinden su ayuda porfavor

alex1084 · #5 (**permalink**) 08/05/2013, 16:02

Mira ocupa librerias ya creadas facilitan mucho la vida...

No estoy muy familiarizado con esto

Código Javascript:

Ver original//Browser Support Code
function ajaxFunction(){
 var ajaxRequest;  // The variable that makes Ajax possible!
    
 try{
   // Opera 8.0+, Firefox, Safari
   ajaxRequest = new XMLHttpRequest();
 }catch (e){
   // Internet Explorer Browsers
   try{
      ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
   }catch (e) {
      try{
         ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
      }catch (e){
         // Something went wrong
         alert("Your browser broke!");
         return false;
      }
   }
 }

Pero con la librerias como jquery no necesitas andar evaluando nada de esto..

Además con una libreria hay muchas cosas prefabricadas y no necesitas reinventar la rueda..

http://docs.jquery.com/Tutorials#Tut...n_espa.C3.B1ol

hans2488 · #6 (**permalink**) 08/05/2013, 18:18

Bueno gracias por todas las respuestas tendre q ver otras opciones