jquery drag drop values with php

Question

i have to objects / elements. one is [ 4 images with different ids ] and [ a div with id container ]....

i want to make images dragable and alert the id of image if it is dragged and dropped properly inside container div.......

and then send its value to mysql with php and jquery $.ajax

Answer 1

Use jQuery UI's Dropable

$( 'selector for DIV' ).droppable ( {
    drop: function ( event, ui ) {
        // ui.draggable is a jQuery object representing your image
    }
} );

Answer 2

$('#container').droppable({
   accept: 'img'
  drop: function(event, ui){
    var id=$(ui.draggable).attr('id');
    $.ajax({
      url: 'myurl.php',
      data: {id: id},
      success: function(data){
        //do something with data
      }

    })
  }
});
$('img.draggable').draggable();//assuming all draggable images have a draggable class