Есть такая тема:http://satton.ru
Автор: Гавриленко Виктор
Но мне нужно сделать так, чтобы товар перетаскивался в корзину, внутри корзины тоже перемещался мышкой, и также мышкой можно было бы вернуть обратно. Бился методом тыка, не добился, на большее мозгов не хватает. Помогите, пожалуйста.
| Код |
$(document).ready(function() {
//код jquery
$("#tovar li").draggable({
helper: "clone",
cursor: "move",
revert: "invalid",
opacity: 0.8,
});
////////////
$("#cart").droppable({
activeClass: "active_cart",
hoverClass: "hover_cart",
accept: "#tovar > li",
drop: function( event, ui ) {
//Убираем надпись - Перетащите товар в корзину!!!
$(this).find( "#for_tovar" ).remove();
//Копируем содержимое перемещаемого блока и
//записываем в переменную
var clone = ui.draggable.clone();
//Добавляем стилей к элементам перемещаемого
clone.css({'height':'90px','listStyle':'decimal'});
clone.find("p").css({'fontSize':'1em'});
clone.find("#remove_cart").css({'visibility':'visible'});
clone.find("img").css({'width':'125px'})
.animate({'width':'60px'}).css({'float':'left'});
//Сохраняем название товара в переменной
var title = clone.find("#title").html();
//С помощью ajax обращаемся к фалу add_cart.php для добавления товара
$.ajax({
url:'add_cart.php',
data:"title=" + title,
type:'POST',
success: function () {
//Вставляем копию перемещаемого элемента в корзину между тегами <ol>
$("#cart ol").append(clone);
//Показываем ссылку - Оформить заказ
$("#open_cart").css({'visibility':'visible'});
//Реализуем возможность удаления товаров из корзины
//Проверяем был ли клик по перемещенному товару
clone.click(function(event) {
//В переменную target сохраняем точку по которой был клик
var target = $(event.target);
//Проверяем является ли точка клика кнопкой удаления
if(target.is("#remove_cart")) {
//Сохраняем название товара в переменной
var title_del = clone.find("#title").html();
//С помощью ajax обращаемся к фалу add_cart.php для удаления товара
$.ajax({
url:'add_cart.php',
data:"remove=" + title_del,
type:'POST',
success: function () {
//Скрываем удаленный товар
clone.fadeOut(500,function() {
//Удаляем скрытый блок
$(this).remove();
//Проверяем если блок пустой то выводим надпись
//Перетащите товар в корзину!!!
// И скрываем ссылку Оформить заказ
var cart = $('#cart li').html();
if(cart == null) {
$("#cart").prepend("<div id='for_tovar'>Перетащите товар в корзину!!!</div>");
$("#open_cart").css({'visibility':'hidden'});
}
});
}
});
}
////
});
}
});
}
});
///////////
});
|
|