我正在使用jQuery gridster并保存数据库中的位置。我还有一个常规添加新按钮,用于在每个网格中添加新的网格和删除按钮以删除它。当用户移动,添加或删除时,我正在使用ajax调用。在数据库中有一个user_id和一个jsonstring字段。当用户拖动或单击删除/添加时,我将获取所有网格,创建一个json字符串并将其保存到数据库。
添加新代码:
$(document).on('click', '.add-new', function(){
gridster.add_widget(html); // html code for GS is saved in html variable
savegs();
})
删除代码
$(document).on('click', 'a.ak-delete', function(){
gridster.remove_widget($(this).parents('li.gs_w'));
// I am calling the same save function for delete
savegs();
})
保存网格代码:
function savegs(){
var saveJson = "";
$('.gridster > ul > li.gs_w').each(function (){
var $item = $(this);
var col = $item.data('col');
var row = $item.data('row');
var sizex = $item.data('sizex');
var sizey = $item.data('sizey');
var saveJson += -------- -------;// generate json
});
// then i generate a json string in the loop above
}
添加新功能可以正常使用。但删除有问题。它正在销毁该项目,但仍然在每个功能中获取它。所以它保存在数据库中。谁能说出问题是什么?
感谢。
答案 0 :(得分:0)
好的..经过一些调整后,我找到了解决方案。在删除功能中,我在li(gs_w)中添加了一个类(已删除)。然后在savegs函数中,我正在检查是否有一个名为(已删除)的类。如果是,则将其从保存中排除。这很有趣;但是有效!
$(document).on('click', 'a.ak-delete', function(){
$(this).parents('li.gs_w').addClass('deleted');
gridster.remove_widget($(this).parents('li.gs_w'));
savegs();
})
function savegs(){
var saveJson = "";
$('.gridster > ul > li.gs_w').each(function (){
if (!$(this).hasClass("deleted")) {
var $item = $(this);
var col = $item.data('col');
var row = $item.data('row');
var sizex = $item.data('sizex');
var sizey = $item.data('sizey');
var saveJson += -------- -------;// generate json
}
});
}