in my html page i apply drag and drop feature and jpages also,
when i drag item from 1 list and add it to another list on which jpages apply, It shows that item on every jpages
means if my list contain <-previous 1 2 3-> so that item dissplay on every page ,but that item added only onces in li,but it display on every page
my script
<script>
$(function () {
$('.sortable2').draggable({ revert: true});
('.btn-bg').droppable({
hoverClass: 'active',
accept:'#sortable1 #aside1',
drop: function (event, ui) {
$(ui.draggable).remove()
}
});
$('#sortable1').droppable({
drop:function(event,ui){
accept: ":not(.ui-sortable-helper)",
}
}) ;
$("#sortable1,#sortable2").sortable({
connectWith: ".connectedSortable" ,
receive: function () {},
update: function (event, ui) {}
}).disableSelection().droppable({
drop: function (ev, ui) {
var draggableId = ui.draggable.attr('id');
var draggedIdConcat = '#' + draggableId;
$(draggedIdConcat).effect("highlight", { color: "#F2FF00" });
destroyAndCreate();
}
});;
$("#holder").jPages({
containerID: "sortable2",
perPage:12,
startPage: 1,
startRange: 1,
midRange:2,
endRange: 1,
});
$("#pager").jPages({
containerID: "sortable1",
perPage: 6,
startPage: 1,
startRange: 1,
midRange: 2,
endRange: 1
});
});
function addNewElement() {
}
function destroyAndCreate(){
var pages=$("#pager").jPages("destroy");
pages.jPages({
containerID : "sortable1",
perPage : 6,
startPage: 1,
startRange: 1,
midRange: 2,
endRange: 1
});
}
</script>