Ir para o conteúdo
  • Revista PROGRAMAR: Já está disponível a edição #57 da revista programar. Faz já o download aqui!

IvanGS

Drag and Drop com um SetPostion

Mensagens Recomendadas

IvanGS    0
IvanGS

Bons dias, tenho aqui um trabalho que é umas div's com drag and drop, e depois é para guardar na BD a posição... até aí está feito :D

O problema é que depois não consigo fazer um mete-las pela ordem que está na BD, alguém me pode ajudar??

o código é este:

function drop(drop_target, e) 
		{
			var id = e.dataTransfer.getData('Text');
			drop_target.appendChild(document.getElementById(id));
			var mydiv = document.getElementById(drop_target.id);
			e.preventDefault();
		}

//variáveis
		var i, array_produtos, string_array;
		//recebe a string com elementos separados, vindos do PHP
		string_drop = "<?php echo $string_drop; ?>";
		string_drag = "<?php echo $string_drag; ?>";
		//transforma esta string em um array próprio do Javascript
		array_drop = string_drop.split("|");
		array_drag = string_drag.split("|");

		//varre o array só pra mostrar que tá tudo ok


		for (var i = 0; i<array_drop.length; i++)
		{
			//alert( array_drag[i] );
			array_drop[i].appendChild(document.getElementById(array_drag[i]));
		}

o código que está fora da funçãoé o código que supostamente deveria estar a mandar as DIV's para o lugar

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites
IvanGS    0
IvanGS

já consegui meter as div's como está na BD, mas só me faz a primeira :s e o comprimento do array tem 6 valores... mas só me posiciona o primeiro...

alguem me pode ajudar??

var i, array_produtos, string_array;
		//recebe a string com elementos separados, vindos do PHP
		string_drop = "<?php echo $string_drop; ?>";
		string_drag = "<?php echo $string_drag; ?>";
		string_html = "<?php echo $string_html; ?>";
		//transforma esta string em um array próprio do Javascript
		array_drop = string_drop.split("|");
		array_drag = string_drag.split("|");
		array_html = string_html.split("|");

		for (var i = 0; i<array_html.length; i++)
		{
			if (array_html[i] != "END")
			{
				var div1 = document.getElementById(array_drag[i]);
				var div2 = document.getElementById(array_drop[i]);
				div2.appendChild(div1);
				div1 = "";
				div2 = "";
				alert(i)
			}
		}

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites
IvanGS    0
IvanGS

o meu código está assim, não mexi nesta parte ontem porque fiquei encravado, e então avancei noutras coisas...

var i, array_produtos, string_array, string_html;

string_drop = "<?php echo $string_drop; ?>";
string_drag = "<?php echo $string_drag; ?>";
string_html = "<?php echo $string_html; ?>";

array_drop = string_drop.split("|");
array_drag = string_drag.split("|");
array_html = string_html.split("|");
alert(array_drop.length)
for (var i = 0; i<array_drop.length; i++)
{
     var div1 = document.getElementById(array_drag[i]);
     var div2 = document.getElementById(array_drop[i]);
     div2.appendChild(div1);
}

as variaveis string_drop, string_drag e string_html são variaveis que veem da BD onde estão guardadas as posições...

ele só me posiciona a primeira div, e se eu fizer um alert com o i (o contador) ele dá-me 0... mas se eu fizer um alert com o array_drop.length ele dá-me 6, que é o numero de registos que estão na BD...

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites
IvanGS    0
IvanGS

assim??

var i, array_produtos, string_array, string_html;

		string_drop = "<?php echo $string_drop; ?>";
		string_drag = "<?php echo $string_drag; ?>";
		string_html = "<?php echo $string_html; ?>";

		array_drop = string_drop.split("|");
		array_drag = string_drag.split("|");
		array_html = string_html.split("|");
		for (var i = 0; i<array_drop.length; i++)
		{
			var div1 = document.getElementById(array_drag[i]);
			var div2 = document.getElementById(array_drop[i]);
			div2.appendChild(div1);

			//Div's de Drag
			//DRAG:
				//user1
				//user2
				//user3

			//Div's Drop
			//DROP:
				//topCenter
				//bottomCenter
				//topRight

			topCenter.appendChild(user1);
			bottomCenter.appendChild(user2);
			topRight.appendChild(user3);


		}

eu estou a guardar o ID das div's...

Motivo:

Alterei aqui o for, e comentei o appendChild, e meti alert's para ver se ele fazia o for... e faz, ele mostra-me os resultados, se eu descomentar ele só faz o for uma vez...

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites
IvanGS    0
IvanGS

mais um teste lol

experimentei agora mete-los 'manualmente'

tipo assim:

var div1topCenter = document.getElementById('user1');
var div2topCenter = document.getElementById('topCenter');
div2topCenter.appendChild(div1topCenter);

var div1bottomCenter = document.getElementById('user2');
var div2bottomCenter = document.getElementById('bottomCenter');
div2bottomCenter.appendChild(div1bottomCenter);

var div1topRight = document.getElementById('user3');
var div2topRight = document.getElementById('topRight');
div2topRight.appendChild(div1topRight);

var div1topRight = document.getElementById('user4');
var div2topRight = document.getElementById('leftTop');
div2topRight.appendChild(div1topRight);

e assim funcionou...

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites
brunoais    69
brunoais

Não estás a ajudar...

Aonde está:

		string_drop = "<?php echo $string_drop; ?>";
		string_drag = "<?php echo $string_drag; ?>";
		string_html = "<?php echo $string_html; ?>";

escreve:

		string_drop = "<?php echo $string_drop; ?>";
		alert(string_drop);
		string_drag = "<?php echo $string_drag; ?>";
		alert(string_drag);
		string_html = "<?php echo $string_html; ?>";
		alert(string_html);

...e indica o que apareceu em cada alert sff.

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Crie uma conta ou ligue-se para comentar

Só membros podem comentar

Criar nova conta

Registe para ter uma conta na nossa comunidade. É fácil!

Registar nova conta

Entra

Já tem conta? Inicie sessão aqui.

Entrar Agora


×

Aviso Sobre Cookies

Ao usar este site você aceita a nossa Política de Privacidade