Ajuda com drag and drop Salvar no mysql ao mover [RESOLVIDO]

1. Ajuda com drag and drop Salvar no mysql ao mover [RESOLVIDO]

wmendes
(usa Ubuntu)

Enviado em 16/08/2013 - 11:00h

Bom dia!

tenho um bd com uma tabela com os seguintes campos

idtarefa, tarefa, idtarefapai

como faço pra assim que eu mover um item para outro menu altere o id no mysql tambem ??

segue o script

<script type="text/javascript">

var sitemapHistory = {
stack: new Array(),
temp: null,
//takes an element and saves it's position in the sitemap.
//note: doesn't commit the save until commit() is called!
//this is because we might decide to cancel the move
saveState: function(item) {
sitemapHistory.temp = { item: $(item), itemParent: $(item).parent(), itemAfter: $(item).prev() };
},
commit: function() {
if (sitemapHistory.temp != null) sitemapHistory.stack.push(sitemapHistory.temp);
},
//restores the state of the last moved item.
restoreState: function() {
var h = sitemapHistory.stack.pop();
if (h == null) return;
if (h.itemAfter.length > 0) {
h.itemAfter.after(h.item);
}
else {
h.itemParent.prepend(h.item);
}
//checks the classes on the lists
$('#sitemap li.sm2_liOpen').not(':has(li)').removeClass('sm2_liOpen');
$('#sitemap li:has(ul li):not(.sm2_liClosed)').addClass('sm2_liOpen');
}
}

//init functions
$(function() {
$('#sitemap li').prepend('<div class="dropzone"></div>');

$('#sitemap dl, #sitemap .dropzone').droppable({
accept: '#sitemap li',
tolerance: 'pointer',
drop: function(e, ui){
//alert('teste');
var li = $(this).parent();
var child = !$(this).hasClass('dropzone');
if (child && li.children('ul').length == 0) {
li.append('<ul/>');
}
if (child) {
li.addClass('sm2_liOpen').removeClass('sm2_liClosed').children('ul').append(ui.draggable);
}
else {
li.before(ui.draggable);
}
$('#sitemap li.sm2_liOpen').not(':has(li:not(.ui-draggable-dragging))').removeClass('sm2_liOpen');
li.find('dl,.dropzone').css({ backgroundColor: '', borderColor: '' });
sitemapHistory.commit();
},
over: function() {
$(this).filter('dl').css({ backgroundColor: '#ccc' });
$(this).filter('.dropzone').css({ borderColor: '#aaa' });
},
out: function() {
$(this).filter('dl').css({ backgroundColor: '' });
$(this).filter('.dropzone').css({ borderColor: '' });
}
});
$('#sitemap li').draggable({
handle: ' > dl',
opacity: .8,
addClasses: false,
helper: 'clone',
zIndex: 100,
start: function(e, ui) {
sitemapHistory.saveState(this);
}
});
$('.sitemap_undo').click(sitemapHistory.restoreState);
$(document).bind('keypress', function(e) {
if (e.ctrlKey && (e.which == 122 || e.which == 26))
sitemapHistory.restoreState();
});
$('.sm2_expander').live('click', function() {
$(this).parent().parent().toggleClass('sm2_liOpen').toggleClass('sm2_liClosed');
return false;
});
});

</script>

<body class="has_js">
<div id="container">
<div id="content">
<div id="content_left">
<div id="content_right">

<div class="page">
<div class="page_inner">
<div class="col01">
<ul id="sitemap">
<?php

function menu_arvore($idtarefapai = 0){
$query = mysql_query("SELECT * FROM pro_tarefa WHERE idtarefapai = " . $idtarefapai) or die(erro_mysql());

if(mysql_num_rows($query) > 0){

echo '<ul>';

while($row = mysql_fetch_array($query)){
//.$row['tarefa']

echo '<li>
<dl class="sm2_s_published"><a href="#"class="sm2_expander"> </a>
<dt><a class="sm2_title" href="#">.'.$row['tarefa'].'.</a></dt>
<dd class="sm2_actions"><strong>Actions:</strong> <span class="sm2_move" title="Move">Move</span><span class="sm2_delete" title="Delete">Delete</span><a href="#" class="sm2_addChild" title="Add Child">Add Child</a></dd>
<dd class="sm2_status"><strong>Status:</strong> <span class="sm2_pub" title="Published">Published</span><span class="sm2_workFlow" title="Draft Exists">Draft Exists</span></dd>
</dl>
</li>';

menu_arvore($row['idtarefa']);

echo '</li>';
}

echo '</ul>';
}
}

?>
<?php menu_arvore();?>

</div></div></div></div></div></div></div>

Desde já grato!

0 0

Quote

2. Consegui!!!

wmendes
(usa Ubuntu)

Enviado em 30/08/2013 - 09:04h

Consegui assim! esta ai para quem precisar!!! vlw

<head id="ctl00_Head1">

<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.7.2.custom.min.js"></script>

<title>teste2</title>
</head>
<style>
ul {
padding:0px;
margin: 0px;
}
#teste2 {
padding:10px;
background-color:#9F9;
border:2px solid #396;
margin-bottom:20px;
}
#list li {
list-style: none;
}
</style>

<script type="text/javascript">

$(document).ready(function(){
function slideout(){
setTimeout(function(){
$("#test2").slideUp("slow", function () {
});

}, 2000);}

$("#teste2").hide();
$(function() {
$("#list").sortable({ opacity: 0.8, cursor: 'move', update: function() {

var order = $(this).sortable("serialize") + '&update=update';
$.post("update.php", order, function(theResponse){
$("#teste2").html(theResponse);
$("#teste2").slideDown('slow');
slideout();
});
}
});
});

});

</script>

<div id="estilo">
<div id="list">

<div id="teste2"> </div>

<?php
incude("conexao.php");
$query = ("SELECT * FROM pro_tarefa ORDER BY idtarefapai ASC");
$result = mysql_query($query);

while($row = mysql_fetch_assoc($result)){

$idtarefa = stripslashes($row['idtarefa']);
$tarefa = stripslashes($row['tarefa']);

?>

<li id="teste_<?php echo $idtarefa?>"><?php echo $tarefa;?></li>

<?php }?>

</div></div>

######
Arquivo update.php

<?php

//error_reporting(0);
include("conexao.php");

$array = $_POST['teste'];

if ($_POST['update'] == "update"){

$count = 0;
foreach ($array as $idtarefa => $valor) {
$query = ("UPDATE pro_tarefa SET idtarefapai = " . $count . " WHERE idtarefa = " . $valor);
mysql_query($query) or die('Erro ao gravar');
$count ++;
}
echo 'Alteracoes salvas! <br>';
//echo $query;
}
?>

0 0

Quote