Drag e Drop: Sviluppo PHP e MySql riprendere posizioni
Per i moderatori:
Ho evitato di ripescare la disscusione precedente (Curiosita sui drag e drop) poichè si trovava in un'altra categoria
Ecco qui cosa sono riuscito a fare sotto le indicazioni di dementialsite, ma non riesco a capire come prelevare i dati dal database, ringrazio tutti coloro che mi aiuteranno...:
tab
Citazione:
CREATE TABLE `blocchi` (
`id_utente` INT NOT NULL AUTO_INCREMENT PRIMARY KEY ,
`colonna_1` TEXT NOT NULL ,
`colonna_2` TEXT NOT NULL ,
`colonna_3` TEXT NOT NULL
) ENGINE = MYISAM ;
save.php
Codice PHP:
<?
session_start();
if(isset($_GET['firstlist'])){$firstlist=$_GET['firstlist'];}else{$firstlist=Array();}
if(isset($_GET['secondlist'])){$secondlist=$_GET['secondlist'];}else{$secondlist=Array();}
if(isset($_GET['thirdlist'])){$thirdlist=$_GET['thirdlist'];}else{$thirdlist=Array();}
$colonna1=str_replace("key","",implode(",",$firstlist));
$colonna2=str_replace("key","",implode(",",$secondlist));
$colonna3=str_replace("key","",implode(",",$thirdlist));
//conessione al database
require('config.ini.php');
$query="INSERT INTO tab (colonna1,colonna2,colonna3) VALUES ('$colonna1','$colonna2', '$colonna3')";
if(!mysql_query($testo,$dbh)) /*eseguo la query e controllo se va a buon fine ^^*/
die("<h1>".mysql_error()."</h1>");
mysql_close($db_nome);
?>
index.php
Codice PHP:
<?
session_start();
//array elementi -> possono anche essere presi da database
$elemento[1]['titolo']="TITOLO 1";
$elemento[1]['contenuto']="Contenuto 1.";
$elemento[2]['titolo']="TITOLO 2";
$elemento[2]['contenuto']="Contenuto 2.";
$elemento[3]['titolo']="TITOLO 3";
$elemento[3]['contenuto']="Contenuto 3.";
$elemento[4]['titolo']="TITOLO 4";
$elemento[4]['contenuto']="Contenuto 4.";
$elemento[5]['titolo']="TITOLO 5";
$elemento[5]['contenuto']="Contenuto 5.";
$elemento[6]['titolo']="TITOLO 6";
$elemento[6]['contenuto']="Contenuto 6.";
$elemento[7]['titolo']="TITOLO 7";
$elemento[7]['contenuto']="Contenuto 7.";
$elemento[8]['titolo']="TITOLO 8";
$elemento[8]['contenuto']="Contenuto 8.";
$elemento[9]['titolo']="TITOLO 9";
$elemento[9]['contenuto']="Contenuto 9.";
//controllo cookie
$query = mysql_query("SELECT * FROM tab");
if(!$query){ die('Errore: non riesco a eseguire la query'); }
/*************
COME FACCIO A RICHIAMARE LA POSIZIONE???
*************/
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Drag and drop salvataggio posizione</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script src="js/blocchi/prototype.js" type="text/javascript"></script>
<script src="js/blocchi/scriptaculous.js" type="text/javascript"></script>
<script src="js/blocchi/unittest.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="css/blocchi/style.css" />
<script>
var arraytitoli = new Array();
var arraycontent = new Array();
<?for($el=1;$el<=count($elemento);$el++){?>
arraytitoli.push('<?=$elemento[$el]['titolo']?>');
arraycontent.push('<?=$elemento[$el]['contenuto']?>');
<?}?>
function crea(elemento){
if(!$('firstlist_key'+elemento) && !$('secondlist_key'+elemento) && !$('thirdlist_key'+elemento)){
newitem=Builder.node( 'li', {className:'item',id:'firstlist_key'+elemento});
newtitle=Builder.node( 'div', {className:'handle'},arraytitoli[elemento-1]);
newchiudi=Builder.node( 'div', {className:'chiudi'});
newlink=Builder.node( 'a', {href:'javascript:rimuovi('+elemento+')', className:'chiudilink'},'x');
newitem.appendChild(newtitle);
newitem.appendChild(newchiudi);
newchiudi.appendChild(newlink);
$('firstlist').appendChild(newitem);
$('firstlist_key'+elemento).innerHTML=$('firstlist_key'+elemento).innerHTML+arraycontent[elemento-1];
var myAjax = new Ajax.Request("save.php", {method:'get',parameters:Sortable.serialize('firstlist')+"&"+Sortable.serialize('secondlist')+"&"+Sortable.serialize('thirdlist')});
rendisortable();
}
}
function rimuovi(elemento){
if($('firstlist_key'+elemento)){$('firstlist_key'+elemento).parentNode.removeChild($('firstlist_key'+elemento));}
if($('secondlist_key'+elemento)){$('secondlist_key'+elemento).parentNode.removeChild($('secondlist_key'+elemento));}
if($('thirdlist_key'+elemento)){$('thirdlist_key'+elemento).parentNode.removeChild($('thirdlist_key'+elemento));}
var myAjax = new Ajax.Request("save.php", {method:'get',parameters:Sortable.serialize('firstlist')+"&"+Sortable.serialize('secondlist')+"&"+Sortable.serialize('thirdlist')});
rendisortable();
}
function rendisortable(){
// <![CDATA[
Sortable.create("firstlist",
{dropOnEmpty:true,handle:'handle',containment:["firstlist","secondlist","thirdlist"],constraint:false,
onUpdate:function(){var myAjax = new Ajax.Request("save.php", {method:'get',parameters:Sortable.serialize('firstlist')+"&"+Sortable.serialize('secondlist')+"&"+Sortable.serialize('thirdlist')}) }});
Sortable.create("secondlist",
{dropOnEmpty:true,handle:'handle',containment:["firstlist","secondlist","thirdlist"],constraint:false,
onUpdate:function(){var myAjax = new Ajax.Request("save.php", {method:'get',parameters:Sortable.serialize('firstlist')+"&"+Sortable.serialize('secondlist')+"&"+Sortable.serialize('thirdlist')}) }});
Sortable.create("thirdlist",
{dropOnEmpty:true,handle:'handle',containment:["firstlist","secondlist","thirdlist"],constraint:false,
onUpdate:function(){var myAjax = new Ajax.Request("save.php", {method:'get',parameters:Sortable.serialize('firstlist')+"&"+Sortable.serialize('secondlist')+"&"+Sortable.serialize('thirdlist')}); }});
// ]]>
}
</script>
</head>
<body onload="rendisortable()">
<?for($el=1;$el<=count($elemento);$el++){?>
<a href="javascript:crea('<?=$el?>')"><?=$elemento[$el]['titolo']?></a>
<?}?>
<div class="container">
<div class="colonna">
<ul class="sortabledemo" id="firstlist">
<?
for($elementi=0;$elementi<count($array_colonna1);$elementi++){
?>
<li class="item" id="firstlist_key<?=$array_colonna1[$elementi]?>">
<div class="handle"><?=$elemento[$array_colonna1[$elementi]]['titolo']?></div>
<div class="chiudi"><a href="javascript:rimuovi(<?=$array_colonna1[$elementi]?>)" class="chiudilink">x</a></div>
<?=$elemento[$array_colonna1[$elementi]]['contenuto']?>
</li>
<?
}
?>
</ul>
</div>
<div class="colonna">
<ul class="sortabledemo" id="secondlist">
<?
for($elementi=0;$elementi<count($array_colonna2);$elementi++){
?>
<li class="item" id="secondlist_key<?=$array_colonna2[$elementi]?>">
<div class="handle"><?=$elemento[$array_colonna2[$elementi]]['titolo']?></div>
<div class="chiudi"><a href="javascript:rimuovi(<?=$array_colonna2[$elementi]?>)" class="chiudilink">x</a></div>
<?=$elemento[$array_colonna2[$elementi]]['contenuto']?>
</li>
<?
}
?>
</ul>
</div>
<div class="colonna">
<ul class="sortabledemo" id="thirdlist">
<?
for($elementi=0;$elementi<count($array_colonna3);$elementi++){
?>
<li class="item" id="thirdlist_key<?=$array_colonna3[$elementi]?>">
<div class="handle"><?=$elemento[$array_colonna3[$elementi]]['titolo']?></div>
<div class="chiudi"><a href="javascript:rimuovi(<?=$array_colonna3[$elementi]?>)" class="chiudilink">x</a></div>
<?=$elemento[$array_colonna3[$elementi]]['contenuto']?>
</li>
<?
}
?>
</ul>
</div>
</div>
</body>
</html>
