Problemilla con respuesta AJAX y Javascript

[drwizard]

Buenas,

Tengo un problemilla y no se como solucionarlo (llevo poco trasteando AJAX), a ver si alguno de por aqui sabe de alguna solución.

Os comento el tema:

Tengo una página escrita en php (llamemosla index.php), que lo que hace es buscar, dados unos parametros, informacion en una base de datos (lo tipico vamos). Lo que hago es llamar la pagina search.php (donde hace la conexión a la bbdd y devuelve los datos) a traves de AJAX, lo recojo con un simple responseText y lo muestro en un DIV, hasta aqui ningun problema, funciona perfectamente.

Problema:

El problema que tengo es, que en el archivo search.php, tengo puesta una llamada a un codigo JS (de hecho es para que cuando pase por encima de cierta parte del resultado de la busqueda me aparezca un tooltip, estoy usando el wz_tooltip) con un onMouseOver, lo que pasa que ponga donde ponga el SRC del archivo JS que ejecuta esa llamada no me funciona de ninguna manera, lo ponga dentro del index.php o lo ponga en el search.php...

Otro handicap es que wz_tooltip te obliga a poner el SRC al final del BODY...

En fin, mi pregunta es: Hay alguna manera de hacer funcionar las llamadas javascript incluidas en un archivo el cual es "leido" a traves de AJAX?

Muchas gracias por adelantado y perdon por el toston! :)

Saludos.

[vengava]

hola drwizard, postea el código a ver si vemos algo...
Un saludo

[drwizard]

Ok, aqui os pongo el codigo:

Tipica funcion AJAX:

Código:

function AJAX_Object() { 
	var xmlhttp=false; 
	try { 
		xmlhttp=new ActiveXObject("Msxml2.XMLHTTP"); 
		}
	catch(e) {
		try { 
			xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
			} 
		catch(E) { 
			xmlhttp=false; 
			}
		}
	if (!xmlhttp && typeof XMLHttpRequest!='undefined') { 
		xmlhttp=new XMLHttpRequest(); 
		} 
	return xmlhttp; 
}

var ajax = AJAX_Object();

function AJAX_getURL(url) {
	ajax.open("GET", url, true);
	ajax.onreadystatechange = AJAX_ResFunc;
	ajax.send(null);
	}

En esta función es donde recojo el resultado de la busqueda (la tipica de AJAX) que se muestra en index.php:

Código:

		
function AJAX_ResFunc() {
  if (ajax.readyState == 4) {
	if (ajax.status == 200) {
		var response = ajax.responseText;
		document.getElementById('contenido').innerHTML = (response);
		}
	}
	// Loading...
	else {
		document.getElementById('contenido').innerHTML = 'Conectando con la Base de datos...';
		}
}

Formulario de busqueda (index.php):

Código HTML:

<form method="post" action="#">
Circuito:
<select name="circuito">
   <option value="ID_1">Circuito 1</option>
</select>
Coche:
<select name="coche">
   <option value="ID_1">Coche 1</option>
</select>
<!-- llamada a AJAX -->
<input type="button" onclick="AJAX_getURL('search.php?circuito=' + document.getElementById('circuito').value + '&coche=' + document.getElementById('coche').value)" value="Buscar" />
</form>
<!-- Div donde se mostrara el resultado de la busqueda -->
<div id="contenido"></div> 

Basicamente, lo que hace eso es que busca en la base de datos si hay algun "setting" para el coche y circuito seleccionado, y devuelve esta tabla (search.php):

Código HTML:

<table>
  <tr>
    <th>Archivo:</th>
    <th>Subido por:</th>
  </tr>
  <tr>
    <td><span onmouseover="this.T_BGCOLOR='#FFFFFF';this.T_BORDERCOLOR='#FF0000';this.T_WIDTH=400; return escape('probando tooltip')"><a href="settings/<?= $row['set_file'] ?>"><?= $row['set_file'] ?></a></span></td>
    <td><?= $row["driver_nick"] ?></td>
  </tr>
  <tr>
    <th colspan="2">Comentario:</th>
  </tr>
  <tr>
    <td colspan="2"><?= $row["set_comment"] ?></td>
  </tr>
</table> 

Aqui es donde tengo el problema, si os fijais, hay un SPAN con un onMouseOver que ejecuta codigo javascript, es el que hace aparecer el tooltip. El problema es,que como eso se muestra a traves de la llamada de AJAX, no ejecuta ese codigo javascript en questión, hay alguna manera de poder ejecutarlo? me han hablado de la funcion EVAL de javascript, pero nose muy bien como funciona.

Este es el SRC del archivo JS necesario para que funcione el tooltip, y que segun su autor debe ir despues de la etiqueta </body> para que funcione. Lo tengo puesto en el index.php.

Código HTML:

<script language="JavaScript" type="text/javascript" src="wz_tooltip.js"></script> 

Si no veis algo claro comentarmelo, muchas gracias por adelantado.

Saludos.

[vengava]

Hola, lo de ponerlo despues del body me parecía rarísimo.
Acabo de leer la web de donde sacaste el script y lo que dice es que pongas:

Código HTML:

<script language="JavaScript" type="text/javascript" src="wz_tooltip.js"></script> 

immediately before the closing </body> tag, but in any case after the last tag containing a tooltip

Como ves, pone:

inmediatamente antes de la etiqueta </body> de cierre, pero en cualquier caso despues de la última etiqueta que contenga un tooltip.

Es posible que esa librería solo funcione con los onmouseover que ya estaban en la página, pero de todas formas prueba a ponerlo antes del cierre del </body> a ver si hay suerte, porque si no habría que bucear en la librería para ver cómo lo hace, pero...

Siempre te queda enviarle un e-mail al programador y comentárselo.

[drwizard]

Gracias por contestar ante todo,

Cierto era antes de </body>, fallo tecnico XD, aunque no funciona ponga donde lo ponga.

De ninguna manera funciona. Me han comentado que es porq el javascript que ejecuta el tooltip está en la página que muestra la llamada de AJAX (search.php), y cualquier porción de codigo que este en esa página no se ejecuta, a no ser que se haga un eval o algo asi (me lo comentaron por encima).

En fin, gracias de todas formas, se agradece la ayuda :)

Saludos.

[vengava]

De todas formas, es posible que lo puedas hacer con algo así, escribiendo la tabla en la primera página (la que hace la llamada AJAX) y ocultándola con 'display:none'.
Para los campos variables pones divs vacíos:

Código HTML:

<table id="tabla_oculta" style="display:none">
  <tr><th>Archivo:</th><th>Subido por:</th></tr>
  <tr>
    <td>
      <span onmouseover="this.T_BGCOLOR='#FFFFFF';                                        
                         this.T_BORDERCOLOR='#FF0000';
                         this.T_WIDTH=400;
                         return tooltip()">
            <div id="set_file"></div>                                                
          </span>
    </td>
    <td>
      <div id="driver_nick"></div>
    </td>
  </tr><tr><th colspan="2">Comentario:</th></tr>
  <tr>
    <td colspan="2">
      <div id="set_comment"></div>
    </td>
  </tr>
</table> 

Luego, en la misma página (la que hace la llamada AJAX) defines una función javascript que llamarás desde search.php.
Esta función rellenará esos divs con los datos que vas a recoger del PHP, más o menos así:

Código HTML:

<script>
//esto devolvería el texto del onmouseover
function tooltip(){
  return escape(texto_tooltip);
}
//Esta función es llamada por search.php
//Rellena los divs y luego muestra la tabla oculta
function mostrarTabla(set_file, driver_nick,set_comment){
  document.getElementById("set_file").innerHTML = "<a href=\"settings/" + set_file + "\">" + set_file + "</a>";
  document.getElementById("driver_nick").innerHTML = driver_nick;
  document.getElementById("set_comment").innerHTML = set_comment;
  document.getElementById("tabla_oculta").style.display = "block";
}
</script> 

Luego, en el PHP que cargas con AJAX, devuelves el javascript que asigne valor a texto_tooltip y que llame a la función que rellena los divs y muestra la tabla :

Código PHP:

  //Escribes la salida del PHP como javascript
header("Content-type: text/javascript; charset=utf-8");
//Asignas la cadena que saldrá cuando se llame el onmouseover
echo "texto_tooltip = 'lo que sea';\n";
//Llamas a la función mostrarTabla con los datos que quieras
echo "mostrarTabla('$row[set_file]','$row[driver_nick]','$row[set_comment]');"; 
   

Es posible que haya errores de comillas o de otras cosas, no lo probé, pero supongo que algo parecido funcionaría.

[drwizard]

Muchas gracias por la ayuda vengava, en cuanto pueda pruebo lo que me comentas y te digo algo :)

Saludos.

[vengava]

Hola otra vez:

No haría falta dar una salida javascript a search.php.

Código:

header("Content-type: text/javascript; charset=utf-8");
...

Sería suficiente con que search.php devuelva un array o una cadena con separadores predefinidos (por ejemplo ###)
Luego en el evento onreadystate de ajax

Código:

ajax.onreadystatechange = function() {
   if (ajax.readyState == 4) {
      if (ajax.status == 200) {
         //si envías una cadena con separadores '###'
         var trozos = ajax.responseText.split("###");
         texto_tooltip = trozos[0];
         mostrarTabla(trozos[1],trozos[2],trozos[3]);
      }
   }
}

[Ruchu]

drwizard...... un petonet.

[B**]

O tambien puedes usar la libreria de prototype... y usar evalscripts:true , para que puedas retornar JS