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