开发者

jquery UI draggable helper: clone removes draggable from original?

开发者 https://www.devze.com 2023-02-17 07:49 出处:网络
I am using draggable with the following options: $(\"#accountDetailPanel .draggable\").draggable({ helper: \'clone\',

I am using draggable with the following options:

$("#accountDetailPanel .draggable").draggable({
    helper: 'clone',
    appendTo: 'body',
    cursor: 'move',
    revert: 'invalid'
});         
$(".accountPod").droppable({ accept: '.draggable' });

I'm applying draggable to the content of the 2nd tab of a jquery UI tab upon loa开发者_C百科d:

jquery UI draggable helper: clone removes draggable from original?

The issue is only the first drag works fine. When I don't drop the draggable into an acceptable droppable, the pod reverts back but I can't do another drag. No matter what, the dragged pod loses its draggableness.

jquery UI draggable helper: clone removes draggable from original?

In attempting to apply a stop function to the draggable init put me on a path to needing to nest infinite .draggable calls.

The full script:

$(document).ready(function(){

  $("#tabs").tabs();

  /**
   * Click on account pod -> account detail pane is populated
   *   Inside account detail, tabs pulled dynamically
   *     Installation List - each installation (home) is movable
   */
  $(".accountPod").live("click", function(event){

    var account_id = $(this).attr("id").replace("acct_", "");

    // load user's details into tab panel (replace all tabs)
    $("#accountDetailPanel").load("/accountDetail/" + account_id, function(){

      // post-load of tabs html
      $("#tabs").tabs();

      // init draggables
      $("#accountDetailPanel .draggable").draggable({
        helper: 'clone',
        appendTo: 'body',
        cursor: 'move',
        revert: 'invalid'
      });

      $(".accountPod").droppable({ accept: '.draggable' });

    });

  });

});

Since this fiddle works: http://jsfiddle.net/notbrain/DycY6/41/ I'm definitely thinking it's related to the dynamic application of .draggable() when the tabs are loaded.

Any pointers are greatly appreciated!


I think the issue is unfortunately that of the libraries being loaded. I found that using jQuery 1.8.5 and jQuery-git.js worked.

0

精彩评论

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