drag'n'drop, передача параметра
Добрый день.
Пишу некий мониторинг задач (см. скриншот). Белые полосы - дроп-элементы, на которые можно перетаскивать задачи - цветные полосы (драг-элементы). Выглядит это примерно так: <div class="pole_zad"> <div myid="4285" class="droppable" style="position:absolute;top:2px;height:42px;background:#ffffff;width:100%;"><p></p></div> <div myid="4287" class="droppable" style="position:absolute;top:44px;height:42px;background:#ffffff;width:100%;"><p></p></div> <div myid="4296" class="droppable" style="position:absolute;top:86px;height:42px;background:#ffffff;width:100%;"><p></p></div> <div myid="4310" class="droppable" style="position:absolute;top:128px;height:42px;background:#ffffff;width:100%;"><p></p></div> </div> <div id='el2' idzad='5566' class='draggable'>12</div> <script> $(".draggable").draggable({ snap: ".hr", snapMode: "both", containment:".pole_zad", scroll:false}); $(".droppable").droppable({ drop:function(event, ui){ $(this).addClass("ui-state-highlight") .find("p") var this_param = $(this).attr("myid"); var id_zad = $(".draggable").attr("idzad"); alert(id_zad); var lefto = screen.availWidth/2-275; var righto = screen.availHeight/2-250; window.open("/task_monitor/task_info.php?id="+id_zad+"&user="+this_param+"&move=1&mod=1","","height=350,width=500,scrollbars=yes,resizable=yes,menubar=no,toolbar=yes,status=yes,left="+lefto+",top="+righto+""); } }); </script> Суть в следующем - при переносе цветного блока на новую строку, необходимо чтобы обновилась информация в базе данных и открылось окно для редактирования задачи (того самого переносимого цветного блока). После того, как на .droppable элемент попадает цветной блок, открывается окно task_info.php?id="+id_zad+"&user="+this_param+"&mo ve=1&mod=1 , с параметром из переносимого и из того, в который переносят. так вот, если цветной блок один - всё ок. Если их несколько - id_zad всегда равен одному и тому же значению. Как сделать так, чтобы данной переменной присваивалось значение именно из переносимого блока? А может стоит решить задачу как-то иначе? Например открыть попап окно при событии маусап на переносимом элементе? Как тогда передать ему аналогичные параметры - параметр из переносимого и параметр из того. на которые был перенесён? Надеюсь, объяснил задачу более-менее доступно. Спасибо за помощь... |
Вопрос решён + добавлено немного другого функционала (ещё смотрю на сколько смещено в сторону, дабы изменять время начала задачи).
<script> $(".draggable").draggable({ snap: ".hr", snapMode: "both", containment:".pole_zad", scroll:false, start: function(event, ui) { id_zad = $(this).attr("idzad"); var coord = $(this).position(); left_zad = coord.left; } }).mousemove(function(){ var coord = $(this).position(); left_zad_mod = coord.left; }); $(".droppable").droppable({ drop:function(event, ui){ $(this).addClass("ui-state-highlight") .find("p") var this_param = $(this).attr("myid"); var lefto = screen.availWidth/2-275; var righto = screen.availHeight/2-250; sek = Math.round((left_zad_mod - left_zad) * 1.425 * 60); $.get("task_info.php", { id: id_zad, user: this_param, min: sek, move: 1, mod: 1 } ); } }); </script> |
Часовой пояс GMT +3, время: 23:38. |