drag and drop jquery

dieguito12 · #1 (**permalink**) 11/02/2014, 18:50

Buenas tardes a todos, quisiera saber si alguien me da una manito, estoy tratando de hacer draggable la siguiente tabla.

Código PHP:

      echo "<table>";

                                echo "<thead><tr>

                                        <th>Nombre</th>

                                        <th>Fecha creacion</th>

                                        <th>Fecha resolucion</th>

                                        <th>Fecha tentavita</th>

                                        <th>Notas</th>

                                        <th></th>

                                        </tr></thead>";

                                        $login_nick = $_SESSION["nick"];

                                        $estadoTarea = 1;

                                        $estadoAI = 1;

                                        $resultado = consultar("SELECT * FROM tareas WHERE estadoActivoInactivo='$estadoAI' AND estadoTarea_estadoTarea='$estadoTarea' AND login_nick='$login_nick'");

                                        echo "<tbody id='tarea'>";

                                        while($row = mysql_fetch_array($resultado)){

                                            echo "<tr id='".$row["idTarea"]."'>";

                                            echo "<td><p>".$row["nombreTarea"]."</p> </td>";

                                            echo "<td><p>".$row["fechaCreacion"]."</p> </td>";

                                            echo "<td><p>".$row["fechaResolucion"]."</p> </td>";

                                            echo "<td><p>".$row["fechaTentativa"]."</p> </td>";

                                            echo "<td> <p>".$row["notas"]."</p></td>";

                                        }

                                        echo "</tbody></table></div>";

                            break;

La idea es arrastrar los registros cardos desde la base de datos a un menu que tengo en la izquierda y poder soltarlo sobre cualquier opcion, el codigo del menu es.

Código HTML:

<ul class="nav nav-sidebar"  id="lista">
						<li>Tareas</li>
						<li><a href="inbox.php?pagina=bandeja">Bande de entrada <span class="badge"><?php $cant = contar(1); if($cant != "0")echo $cant; else echo"";?></span></a></li>
						<li><a id="irNuevaTarea" href="#">Nueva tarea</a></li>
					</ul>
					<ul class="nav nav-sidebar" id="lista">
						<li>Acciones</li>
						<li><a href="inbox.php?pagina=archivar">Archivar <span class="badge"><?php $cant = contar(2); if($cant != "0")echo $cant; else echo""; ?></span></a></li>
						<li><a href="inbox.php?pagina=resolver">Resueltas <span class="badge"><?php $cant = contar(3); if($cant != "0")echo $cant; else echo""; ?></span></a></li>
					</ul>
					<ul class="nav nav-sidebar"  id="lista">
						<li>Organizar</li>
						<li><a href="inbox.php?pagina=proximo">Proximo <span class="badge"><?php $cant = contar(4); if($cant != "0")echo $cant; else echo""; ?></span></a></li>
						<li><a href="inbox.php?pagina=delegar">Delegar <span class="badge"><?php $cant = contar(5); if($cant != "0")echo $cant; else echo""; ?></span></a></li>
						<li><a href="inbox.php?pagina=espera">Espera <span class="badge"><?php $cant = contar(6); if($cant != "0")echo $cant; else echo""; ?></span></a></li>
					</ul>
					<ul class="nav nav-sidebar"  id="lista">
						<li>Proyectos</li>
						<li><a href="inbox.php?pagina=proyecto&opcion=activos">Activos <span class="badge"><?php $cant = contar(7); if($cant != "0")echo $cant; else echo""; ?></span></a></li>
						<li><a href="inbox.php?pagina=proyecto&opcion=crear">Crear</a></li>
						<li><a href="inbox.php?pagina=proyecto&opcion=modifica">Modificar</a></li>
					</ul>
					<ul class="nav nav-sidebar"  id="lista">
						<li><a href="inbox.php?pagina=eliminados">Eliminados <span class="badge"><?php $cant = contar(8); if($cant != "0")echo $cant; else echo""; ?></span></a></li>
					</ul>

Lo que tengo hasta ahora y que no me funciona es:

Código HTML:

       	$(document).ready(function(){ 	
			var $tabla = $('#tarea'), $lista = $('#lista');
			$('tr', $tabla).draggable({	
				cursor: 'move',
				connectWith: '#lista li',
				revert: true
			});
			$('li', $lista).droppable({
				accept: '#tarea tr',
				drop: function(ev, ui) {
				alert("Item soltado");
				}
			});
			
			});

Que error puedo tener, llevo un par de horas dandole vueltas y ya se me agotaron las ideas. Otra cuestion es que al soltar el registro en el menu, el mismo tiene que cambiarse el estado en la base de datos.

Desde ya muchas gracias a todos y saludos.