I am using jquery draggable in my app where I applied draggable to image and saved positions(x and y coordinates) in database. as I am dealing with the server and database when I am on edit then the image should be stayed at where it was placed before saved.
I have x,y coordinates with me , so now I need to apply them for image so that it will be placed on the screen where it was before save, How to do this ?
I tried by applying css through jquery to the draggable image but not worked .
$("#dvPreview").append("<img id='draggable' />");
$('#dvPreview img').attr('src', $("#eidtedfile").attr("src"));
if($("#dvPreview img").width() > 640 ){
$("#dvPreview img").width("638")
}
x = $("#x").val().toNum()
y = $("#y").val().toNum()
$("#dvPreview img").css({'top': y , 'left' : x});
$("#draggable" ).draggable({
containment: "parent",
drag: function() {
var $this = $(this);
var thisPos = $this.position();
var parentPos = $this.parent().position();
var x = thisPos.left - parentPos.left;
var y = thisPos.top - parentPos.top;
$("#x").val(x);
$("#y").val(y);
}
})