开发者

jquery ui multiple drops problem

I have 2 droppable divs and when a drag is dropped on either one of them, i'm trying to get the id of that drop element. It's always returning the id of the first drop element in the DOM.

$('#albumImgs li').draggable({
  containment: '#content',
  scrollSensitivity: 60,
  revert: 'invalid',
  cursor: 'move'
});

$('.dropContainerClosed').droppable({
  accept: '#albumImgs li',
  activeClass: 'dropContainerOpen',
  drop: function(ev开发者_Go百科ent, ui) {

    var file = $(ui.draggable.find('img'));
    var fileName = file.attr('alt');

    var albumName = $('div.dropContainerClosed').attr('id');

    console.log("fileName = "+fileName);
    console.log("albumName = "+albumName);//always returns the first div.dropContainerClosed id in the DOM

    if(albumName != undefined) {
        $.post('addImage.php', {filen: fileName, albumn: albumName}, 
      function(data) {
        //do something here
      }, 'json');
    } else {
        $.post('firstImage.php', {filen: fileName, albumn: albumName}, 
      function(data) {
        //do something here
      }, 'json');
    }           
  }
});


You need to use ui.item.attr('id');

se my similar responce on this question!

Getting the position of the element in a list when it's drag/dropped (ui.sortable)

    $(function() {
    $my_droppable = $('#my_droppable');

    $my_droppable.droppable({
              accept: '#my_droppable > li',
              activeClass: 'ui-state-highlight',
              drop: function(ev, ui) {
    //define your func after drop..
                get_my_attr(ui.draggable);
              }
            });

//THIS IS IMPORTANT FOR GET THE ATTR AND OTHER STUFF

// resolve the icons behavior with event delegation

        $('ul.my_droppable > li').click(function(ev) {
          var $item = $(this);
          var $target = $(ev.target);

          if ($target.is('a.ui-icon-trash')) {
            deleteImage($item);
          } else if ($target.is('a.ui-icon-zoomin')) {
            viewLargerImage($target);
          } else if ($target.is('a.ui-icon-refresh')) {
            recycleImage($item);
          }

          return false;
        });

      });
    });
            function get_my_attr($item) {

              alert($item.attr('class'));

            }
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜