Ajax JavaScriot

georgiy_84 · #1 (**permalink**) 24/10/2012, 06:48

Hola, tengo un problema no puedo ejecutar script de javascript, tengo un ejemplo simple aver si me pueden ayudar desde ya muchas Gracias

index.php

Código PHP:

  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
    <HEAD> 
        <TITLE> 
            Sistema de Encuestas 
        </TITLE> 
        <META http-equiv=Content-Type content="text/html; charset=iso-8859-1"> 
        <STYLE> 
            .texto  
            { 
                FONT-SIZE: 10pt; COLOR: #000000; FONT-FAMILY: sans-serif, Arial, Helvetica; TEXT-DECORATION: none; 
            } 
        </STYLE> 
        <script language="javascript" src="./includes/js/functions.js"></script> 
    </HEAD> 
    <BODY topmargin="0" leftmargin="0" rightmargin="0"> 
        <table> 
            <tr> 
                <td> 
                    <select name="combo" id="combo" onchange="db_preduntas(this);"> 
                        <option value="1">1</option> 
                        <option value="2">2</option> 
                        <option value="3">3</option> 
                        <option value="4">4</option> 
                        <option value="5">5</option> 
                    </select> 
                </td> 
            </tr> 
            <tr> 
                <td id="resultados"></td> 
            </tr> 
        </table> 
    </BODY> 
</HTML>

functions.js (ajax)

Código Javascript:

Ver originalvar conexion1;
function db_preduntas(value) 
{
  conexion1=crearXMLHttpRequest();
  conexion1.onreadystatechange = procesarEventos;
  conexion1.open('GET','./includes/functions/db_preguntas.php?values='+value.value, true);
  conexion1.send(null);
}
 
function procesarEventos()
{
  var resultados = document.getElementById("resultados");
  if(conexion1.readyState == 4)
  {
    resultados.innerHTML = conexion1.responseText;
    
  } 
  else 
  {
    resultados.innerHTML = 'Cargando...';
  }
}
 
function crearXMLHttpRequest() 
{
  var xmlHttp=null;
  if (window.ActiveXObject) 
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  else 
    if (window.XMLHttpRequest) 
      xmlHttp = new XMLHttpRequest();
  return xmlHttp;
}

db_preguntas.php

Código PHP:

  <?php  
    $value=$_GET["values"]; 
    switch ($value){ 
        case 1: 
            echo "Opcion 1"; 
            $valor=1; 
        break; 
        case 2: 
            echo "Opcion 2";     
            $valor=2; 
        break; 
        case 3: 
            echo "Opcion 3"; 
            $valor=3;     
        break; 
        case 4: 
            echo "Opcion 4"; 
            $valor=4;     
        break; 
        case 5: 
            echo "Opcion 5"; 
            $valor=5;     
        break; 
    } 
?> 
<script language='javascript'> 
        alert(<?php echo $valor;?>); 
</script>

En general funciona pero no ejecuta la parte de javascript de alert();

Código Javascript:

Ver original<script language='javascript'>
        alert(<?php echo $valor;?>);
</script>

maycolalvarez · #2 (**permalink**) 24/10/2012, 07:02

principal error de principiantes en ajax: el NO evaluar el conexion1.status == 200 junto con el conexion1.readyState == 4, consulte un manual de AJAX, debe ser:

if ((conexion1.readyState == 4) && (conexion1.status == 200))

Manual recomendado: http://librosweb.es/ajax/index.html

emprear · #3 (**permalink**) 24/10/2012, 07:08

En primer lugar analizá este ejemplo por el tema de la ejecución del javascript en el php
http://foros.emprear.com/ajax/html-css-js-ajax/
En segundo, ¿que sentido tiene hacer ese alert en el php?
si el responseText que recibe Ajax tiene el formato

"Opcion 1"
"Opcion 2"
etc.
Podés extraer el numero de esa misma cadena con un split() y mostrar el alert en el javascript

Saludos

georgiy_84 · #4 (**permalink**) 24/10/2012, 07:47

Cita:

Iniciado por maycolalvarez

principal error de principiantes en ajax: el NO evaluar el conexion1.status == 200 junto con el conexion1.readyState == 4, consulte un manual de AJAX, debe ser:

if ((conexion1.readyState == 4) && (conexion1.status == 200))

Manual recomendado: [URL]http://librosweb.es/ajax/index.html[/URL]

Gracias por consejo tambien asi no me anda :S

georgiy_84 · #5 (**permalink**) 24/10/2012, 08:00

Cita:

Iniciado por emprear

En primer lugar analizá este ejemplo por el tema de la ejecución del javascript en el php
[url]http://foros.emprear.com/ajax/html-css-js-ajax/[/url]
En segundo, ¿que sentido tiene hacer ese alert en el php?
si el responseText que recibe Ajax tiene el formato

"Opcion 1"
"Opcion 2"
etc.
Podés extraer el numero de esa misma cadena con un split() y mostrar el alert en el javascript

Saludos

Gracias por ejemplos, pasa que alert es un ejemplo lo que estoy aciendo es mucho mas grande y no voy a poner en la tema, lo que estoy asiendo es varios consultas en sql armo un array y nesecito cargar a una function de javascript por ejemplo:

Código PHP:

  <?php
      $array=array();
      $array[0]='Hola ';
      $array[1]='Mundo';
      $array[2]='!!!.';
?>
<script type="text/javascript">
        cargarDatos(<?php $array ?>);
</script>

pero tampoco me funciona esto ya que ni siquiera ase alert();
Gracias...

emprear · #6 (**permalink**) 24/10/2012, 08:14

Tenés que hacer uso de la función cargarRecursos() y poner el js en un archivo externo

Revisá el código fuente de los ejemplos, o bajá toda la aplicación

Saludos

georgiy_84 · #7 (**permalink**) 24/10/2012, 09:10

Bueno chicos ya pude solucionar no como yo queria pero lo mas importante que anda aca dejo los codigos si alguien algun dia necesita como de ejemplo:

index.php

Código HTML:

Ver original<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
    <HEAD>
        <TITLE>
            Sistema de Encuestas
        </TITLE>
        <META http-equiv=Content-Type content="text/html; charset=iso-8859-1">
        <STYLE>
            .texto 
            {
                FONT-SIZE: 10pt; COLOR: #000000; FONT-FAMILY: sans-serif, Arial, Helvetica; TEXT-DECORATION: none;
            }
        </STYLE>
        <script language="javascript" src="./includes/js/functions.js"></script>
        <script language='javascript'>
            function cargarDatosRespuestas(datos){
                alert(datos);
            }
            function ejecutar(){
                elemento=document.getElementById('respuestas');
                cargarDatosRespuestas(elemento.value);
            }
        </script>
    </HEAD>
    <BODY topmargin="0" leftmargin="0" rightmargin="0">
        <table>
            <tr>
                <td>
                    <select name="combo" id="combo" onchange="db_preduntas(this);">
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4">4</option>
                        <option value="5">5</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td id="resultados"></td>
            </tr>
        </table>
    </BODY>
</HTML>

functions.js (ajax)

Código Javascript:

Ver original<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
    <HEAD>
        <TITLE>
            Sistema de Encuestas
        </TITLE>
        <META http-equiv=Content-Type content="text/html; charset=iso-8859-1">
        <STYLE>
            .texto 
            {
                FONT-SIZE: 10pt; COLOR: #000000; FONT-FAMILY: sans-serif, Arial, Helvetica; TEXT-DECORATION: none;
            }
        </STYLE>
        <script language="javascript" src="./includes/js/functions.js"></script>
        <script language='javascript'>
            function cargarDatosRespuestas(datos){
                alert(datos);
            }
            function ejecutar(){
                elemento=document.getElementById('respuestas');
                cargarDatosRespuestas(elemento.value);
            }
        </script>
    </HEAD>
    <BODY topmargin="0" leftmargin="0" rightmargin="0">
        <table>
            <tr>
                <td>
                    <select name="combo" id="combo" onchange="db_preduntas(this);">
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4">4</option>
                        <option value="5">5</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td id="resultados"></td>
            </tr>
        </table>
    </BODY>
</HTML>

db_preguntas.php

Código PHP:

  <?php  
    $value=$_GET["values"]; 
    switch ($value){ 
        case 1: 
            echo "Opcion 1"; 
            $valor=1; 
        break; 
        case 2: 
            echo "Opcion 2";     
            $valor=2; 
        break; 
        case 3: 
            echo "Opcion 3"; 
            $valor=3;     
        break; 
        case 4: 
            echo "Opcion 4"; 
            $valor=4;     
        break; 
        case 5: 
            echo "Opcion 5"; 
            $valor=5;     
        break; 
    } 
?> 
<input type="hidden" name="respuestas" id="respuestas" value="<?php echo $valor;?>">

bueno Gracias a todos sobre todo a "emprear" y "maycolalvarez".
Saludos.