ordenar objetos dentro de DIV cargado con ajax.

[OXIGENO]

Hola gente!...
Estoy usando las librerias ToolMan para ordenar drag & drop.

Tengo un archivo principal (Padre).. en el cual hago click sobre una opcion de menu... y hace un Select en mySql y trae registros que muestro dentro de un DIV... (con innerHTML)

Ahora esos registros quiero ordenarlos con el mouse

Pero tengo el famoso inconveniente de que no me carga javascript dentro del div.
Implemente una funcioncita (que de hecho encontre en el foro) que parsea el html y si encuentra etiquetas <script> las evalua y lo vuelve a interpretar, pero solo funciona con poco javascript.
Si uso la libreria y ordeno en el archivo Padre ( que tiene todo el javascript ) ordena a la perfeccion.

Pero precisamente necesitaria ordenar dentro de un DIV.. jeje.. alguna solucion?.
Nunca les toco ordenar asi?.

[GatorV]

Hola OXIGENO,

Si te fijas esa "funcioncita" es todo lo que necesitas para evaluar Javascript dentro de AJAX.

Saludos.

[OXIGENO]

esta vendria a ser la damnificada; "la funcioncita":

Código PHP:

      ///////////////////////////////////////////////  
    function rescatar_script(texto)    {  
    var p1=texto.split("<scrip",2);  
    if (p1[1]) {  
        var p2=p1[1].split(">",2);  
        var p3=p2[1].split("</script",2)  
        if (p3[0] && p3[0]!='') eval(p3[0]); 
        texto=p1[0]+p3[1];  
        texto=rescatar_script(texto);  
    }  
    return texto; }  
    ///////////////////////////////////////////////  
   

y el Javascirpt dentro del DIV seria:

Código PHP:

  <script language="JavaScript" type="text/javascript" src="source_ajax/core.js"></script> 
<script language="JavaScript" type="text/javascript" src="source_ajax/events.js"></script> 
<script language="JavaScript" type="text/javascript" src="source_ajax/css.js"></script> 
<script language="JavaScript" type="text/javascript" src="source_ajax/coordinates.js"></script> 
<script language="JavaScript" type="text/javascript" src="source_ajax/drag.js"></script> 
<script language="JavaScript" type="text/javascript" src="source_ajax/dragsort.js"></script> 
<script language="JavaScript" type="text/javascript"> 
    var dragsort = ToolMan.dragsort(); 
 
    window.onload = function() { 
        dragsort.makeListSortable(document.getElementById("boxes")); 
    }  
     
    function saveOrderList(listId) { 
        //bla bla 
    }        
</script>  
  

Lo que note es que directamente ni abre!.. muestra la imagen de la precarga y de repente desaparece y muere. no muestra ni siquiera el listado de registros que traigo de la DB.

nota: Cargar Js sencillo si funciona.
Alguna idea?.

[GatorV]

Hola OXIGENO,

Si buscas Maborak puso una función más completa, deberías de usar esa, y por otro lado lo más recomendable es si vas a traer scripts con src="", esos los incluyas primeramente en la pagina, y en el DIV solo traigas el Javascript necesario.

Saludos.

[OXIGENO]

GatorV: si... los src="" estan puestos ademas en la pagina Padre si es a lo que te refieres con ...

lo más recomendable es si vas a traer scripts con src="", esos los incluyas primeramente en la pagina, y en el DIV solo traigas el Javascript necesario.

Ya que.. en la pagina padre tambien ordeno elementos... ya intenté poner el javascript necesario en el div (eliminando todos esos src="").. pero no funcionó.
Voy a busar la funcion de Maborak
Muchas gracias.!!

[OXIGENO]

GatorV:

Probe con los prototypes que proponen Maborak y alquien en el mismo post.
Evaluan bien el JS.. pero para ordenar dentro de un DIV no me funciona.

tengo asi:



Dentro de "div Contenedor"
Hice una funcion (a modo debugin ) para ver realmente donde es que devuelve el resultado el codigo "javascript drag B"; entonces simplemente haciendo click sobre cada elemento "<li>" dragable, me muestre el id ( id 1, id 2... )

Código:

<li itemID="box<?php echo $row_rs_item_nivel['id']; ?>" style="width:200px; float:left;cursor: move;padding-top: 5px;margin-bottom:2px;">
<a href="#" onClick="debug('div_en_padre','box<?php echo $row_rs_item_nivel['id']; ?>');">texto descriptivo y mas texto descriptivo </a>
</li>

Código:

	function debug(id, what) {
		var element = document.getElementById(id);
		element.innerHTML = 'Clicked ' + what;
	}

Y casualmente poniendo un DIV llamado "div_en_padre" en la pagina padre.. muestra el resultado de cada click. Cuando en ralidad deberia moistrar el resultado dentro del mismo DIV para que el drag funcione.

A mi entender:
El javascript B es evaluado por el prototype de la pagina padre, y cuando devuelve el resultado; los IDs que referencian a cada objeto que queremos draguear no estan contenidos en la pagina padre donde esta devolviendo en teoria el codigo evaluado, por lo tanto, no encuentra los objetos.... (y claro.. si ponemos ver codigo fuente.. lo contenido en el DIV no existen)

Lo logico seria que al evaluar el codigo el cursor o foco para de la respuesta este posicionado dentro del div contenedor y no en el padre. Creo que es un comportamiento natural del navegador.

En resumen.. cuando se usa codigo dentro del contenedor; y este necesita una interaccion de ida y vuelta ( como es el drag and drop ), por mas que evaluemos el codigo con funciones extra, esto no va a resolvernos nada.

A ver si alguien puede afirmar lo que digo... o negarlo por completo.. jaja
Saludos.

[Panino5001]

En realidad no es así. Cuando asignás al innerHTML de un objeto DOM la respuesta ajax, esta se escribe tal como la traés y sí funcionan los atributos id presentes en dicha respuesta (para ser más exactos, y sólo en algunas versiones de Explorer, no estan disponibles algunos tags, como script y object -o embed, no recuerdo- por ejemplo, pero sí la mayoría de los elementos). Esto, aunque no veas el código fuente, podés verlo escribiendo un bookmarklet como este en la barra de direcciones de tu página:

Código PHP:

  javascript:alert(document.getElementsByTagName('body')[0].innerHTML);void(0);  
   

También tenés que tener en cuenta que no sólo existe la referenciación por id, podés referenciar el elemento de otras maneras (vía getElementsByTagName, vía el objeto event y sus propiedades target (estandar) o srcElement (explorer), etc. )

Otra cosa a tener en cuenta es que, de la misma manera que hay que tratar el código javascript para que funcione, dependiendo de cómo estén definidos, puede ocurrir lo mismo con ciertos estilos css.

[aleprrr]

buenos dias, le encontraron la vuelta para ejecutar scripts dentro del php que llaman con ajax, mi problema es mas complicado aun , no puedo incluir el javascript en el archivo superior , ni puedo incluirlo como .js porque en la funcion que tengo genero los case de un switch con php, o sea que mi funcion javascript se genera en el momento de la carga.
con prototype probe , pero no me funciona , se deben escribir de alguna forma en particular las funciones ?
gracias

[GatorV]

Mmm como es que las generas?, si son anonimas lo mejor es que las pases al objeto document, o window para que las puedas usar, por ejemplo window.function_name = function() { alert( "tada!"); }

Saludos.

[caricatos]

Hola:

No sé si te servirá, pero los ficheros javascript pueden también ser .js.php... o sea que pueden hacerse bucles del estilo:

for (i = 0; i < <?=$n;?>; i ++)...

... y cosas similares...

Estoy en un proyecto donde algunas variables javascript se obtienen de variables php... tal vez te sirva...

Saludos