我已经使用了一些代码来拖放项目,这一切都有效。我需要创建一个表单,以便我可以保存已添加的选定项目,在 PHP mySQL 站点中执行此操作的最佳方法是什么
(我正在构建一个 Joomla 组件顺便说一句)
// jQuery Ui Droppable
$(".basket").droppable({
// The class that will be appended to the to-be-dropped-element (basket)
activeClass:"active",
// The class that will be appended once we are hovering the to-be-dropped-element (basket)
hoverClass:"hover",
// The acceptance of the item once it touches the to-be-dropped-element basket
// For different values http://api.jqueryui.com/droppable/#option-tolerance
tolerance:"touch",
drop:function (event, ui) {
var basket = $(this),
move = ui.draggable,
itemId = basket.find("ul li[data-id='" + move.attr("data-id") + "']");
// To increase the value by +1 if the same item is already in the basket
if (itemId.html() != null) {
itemId.find("input").val(parseInt(itemId.find("input").val()) + 1);
}
else {
// Add the dragged item to the basket
addBasket(basket, move);
// Updating the quantity by +1" rather than adding it to the basket
move.find("input").val(parseInt(move.find("input").val()) + 1);
}
}
});
// This function runs onc ean item is added to the basket
function addBasket(basket, move) {
basket.find("ul").append('<li data-id="' + move.attr("data-id") + '">'
+ '<span class="name">' + move.find("h3").html() + '</span>'
+ '<input class="count" value="1" type="text">'
+ '<button class="delete">✕</button>');
}
// The function that is triggered once delete button is pressed
$(".basket ul li button.delete").live("click", function () {
$(this).closest("li").remove();
});
});