Trovare Element ID

[delphimaster]

Ciao a tutti, premetto che non sono un granchè in java, e lo uso solo come complemento per i miei lavori in php.
Sto sviluppando una pagina in cui e possibile il drag&drop di più immagini da una origine all'interno di un div alla destinazione all'interno di un altro div, tramite dom-drag, e fin qui tutto a posto. Il problema è che il d&d avviene dato un id e le immagini hanno id variabili (vengono visualizzate dinamicamente ), e sono tante. Con la GetElementById tutto funziona ma devo sapere a priori l'id di un elemento.

Questo è il codice di chiamata:

<script type="text/javascript">
    //<![CDATA[

Drag.init(document.getElementById("1"));
document.getElementById("1").onDragEnd = function(x,y) {alert("Oggetto rilasciato nel punto "+x+","+y)};


    //]]>
</script>

Così funziona per un elemento che ha id=1.Ma chiaramente ogni immagine ha un id differente, sconosciuto a priori.
Come posso fare a estrarre l'id di un elemento dinamico, di cui quindi non so nulla al momento in cui chiamo le funzioni per il d&d?

[Andrea1979]

Non so se ti sia utile:

[img]tuapic.jpg[/img]

Comunque sei nella sezione sbagliata. Segnalo al moderatore di spostarti in javascript, non serve che apri una discussione duplicata nell'altro forum

[alka]

Il linguaggio JavaScript non ha nulla a che vedere con Java, se non per la somiglianza nella sintassi.

Sposto la discussione nel forum appropriato.

[ghiaccio84]

Bè mi sembra abbastanza semplice

var imagesId=array();

function retrieveImagesToDrag()
{
arr=documet.getElementsByTagName('img');

for (i=0;i<arr.length;i++)
if (arr[i].id.length>0) imagesId[]=arr[i].id;
}

così hai nell'array imagesId tutti gli id delle immagini che hanno un id.
Se poi altre immagini che non devono subire il drag and drop hanno un id, puoi aggiungere un prefisso a quelle che ti servono realmente e nella funzione controllare se le prime lettere dell'id hanno il prefisso

A proposito potresti mettere nell'array images direttamente i riferimenti agli elementi immagine anziche gli Id, così successivamente non dovresti nemmeno usare getElementByd.

[delphimaster]

Bè, ragazzi, grazie per l'aiuto, ma non sono venuto a capo di nulla ( sono sicuro che è perchè non sono molto ferrato in js ).
Ghiaccio, con il tuo codice ho un array pieno di valori ( gli id delle img), ma come faccio a passare il singolo valore dell'array alla chiamata di drag?
Quindi, se Drag.init(document.getElementById(imagesId[?]));, dove ? è l'id dell'elemento su cui ho cliccato per il drag, come faccio a concretizzare il valore di ?.
Un'altra curiosità: con il codice [img]tuapic.jpg[/img] suggerito da Andrea, l'alert mi dà sempre un messaggio vuoto, come se l'id fosse nullo. Naturalmente guardando l'html l'id c'è per ogni img, che viene caricata dinamicamente da una base di dati mysql tramite uno script php.
Es: <div class="drag" id="1" align="center">[img]BlaBla/a1.jpg[/img]</div>

Grazie a tutti ancora per la pazienza e l'aiuto, e le mie scuse ai mod per l'ot del primo msg.

[Andrea1979]

con che browser? Perché a me con Firefox e IE 6 mi restituisce correttamente l'id dell'immagine... se puoi posta un link ad una pagina di test online... non serve che sia effettivamente la pagina definitiva (quella che pesca i dati dal db, per intenderci), basta che abbia tutti gli script ed un po' di immagini.

[delphimaster]

Non posso postarla perchè è ancora in realizzazione...il browser è sia ie6 che firefox
La dinamica del tutto è questa:
-Stabilisco il path al js esterno in cui risiedono le funzioni per il drag&drop;
-Definisco lo stile per il drag :
[Code]
.drag{
position:relative;
cursor:hand;
z-index: 100;
}
[\Code]
-in php riempio una tabella di immagini

while ($rigaMed= mysql_fetch_row($res))
                {//begin0
                //tabellazione per 2 col alla volta
                if (($a%2)==0) print('<tr>');    
              print('<td width="55" height="15"><div class="drag"  id="'.$rigaMed[2].'" align="center">[img]'.$rigaMed[0].'[/img]</div></td>  ');
                $a+=1;
                if (($a%2)==0) print('</tr>');        
                }//end0 

l'onmouseover è, come hai consigliato tu, a scopo di test.

-Prima della chiusura del body:

<script type="text/javascript">
    //<![CDATA[

Drag.init(document.getElementById(imagesId[?]));

    //]]>
</script>

In cui il ? sta alla problematica di cui all'ultimo post.
Spero di essere stato chiaro, e grazie ancora

[Andrea1979]

bhè, allora vuol dire che hai qualche errore nel flusso html, del tipo, ti resta qualche virgolettato spurio (solo aperto) o ti mancano apici singoli qui e là. Certo che senza un sorgente opportuno non mi resta che tirar fuori la sfera di cristallo.

[Xinod]

scusa ma se riempi il documento con immagini prese dal db non ti e' certo impossibile salvarti in una stringa (php) l' elenco degli id usati, separati da virgola, ottenendo una cosa del genere
$str="a345,a356,a768,a435";

l' istruzione che avvia il drag hai detto che e' interna alla pagina,
dov' e' il problema a fare un explode (di nuovo, php) per virgola e scrivere, dentro a blocco <script>, per ogni id ottenuto Drag.init(document.getElementById("id"));
?

$ids=explode(',',$str);
while($immID = each($ids)){
echo "Drag.init(document.getElementById(\"".$immID['value']."\"));"
}

P.s. id solo numerici sono errati

[ghiaccio84]

:berto: Per la cronaca:

è chiaro che se metti l'ID al div contenitore e non all'immagine contenuta e provi a stapare this.id sull'immagine ti restituisce un valore nullo perchè this è riferito all'immagine e non al div.

devi fare alert(this.parentNode.id)