Jquery Draggable - Làm cách nào để tạo một div có thể kéo mới khi đang di chuyển mà sau đó có thể được kéo?

Question

Tôi đang tạo lập kế hoạch ngày bằng jquery, draggable và droppable.

Khi một công việc được kéo từ cột chưa được gán vào một khoảng thời gian giờ, mục có thể kéo gốc sẽ bị xóa và một div mới được đặt vào trang, với chi tiết công việc.

Khối div mới được tạo này, có tất cả các tham số trong đó để làm cho nó có thể kéo được. Khi nó được hiển thị trên tải trang, những công việc được chỉ định này có thể kéo được.

Chỉ khi chúng được tạo khi đang di chuyển bằng javascript là có điều gì đó ngăn chúng không bị kéo về.

Khi tôi tạo các thẻ div mới này khi đang chạy bằng Javascript, có điều gì tôi cần làm để báo cho jquery biết rằng các mục mới này có nghĩa là được kéo không?

(cảm ơn trước như mọi khi)

bước

• Chúng tôi có một container div với một danh sách công việc (thêm divs) bên trong nó. #unassignedjobs là div cha mẹ cho các công việc này, với các công việc sau bên trong, #jobN, # jobN2, # jobN3
• Chúng tôi có một khu vực khác để chúng tôi có thể thả các mục này vào. mỗi người, cho phép gọi # người này1 và # người2.
• Mục đích là để kéo một công việc từ danh sách việc làm unassigned, và đặt nó vào người danh sách công việc
• Vào phút khi tôi làm điều này, tôi refresh tất cả các html bên trong # PERSON1 khi một mục bị xóa và sử dụng ajax/php để làm lại danh sách công việc cho người này (# person1) và repopulate # person1 bằng cách sử dụng innerHTML.

• Mỗi khi một trang được tạo ra từ php, mọi công việc bên trong # person1 đều xuất hiện khi jquery được kích hoạt, làm cho chúng có thể kéo được. Chỉ khi làm mới và tái dân số của innerHTML được chạy là các mục (#jobN hoặC# jobN2) không thể được kéo

  var createdContent = httpRequest.responseText;

  jobcolp.innerHTML = createdContent;

Hy vọng điều này sẽ giúp vấn đề rõ ràng hơn một chút.

Answer 1

Đơn giản chỉ cần áp dụng kéo để DIV mới được tạo ra. Nếu DIV giống hệt nhau, ngoại trừ vị trí, bạn cũng không thể tạo lại nó, nhưng chỉ định vị lại nó. Điều này sẽ giữ lại tất cả các trình xử lý của nó.

// remove, reposition, reapply handlers 
$('#jobN').remove().appendTo('#dayViewN').draggable(); 

hoặc

// reposition, retain handlers 
$('#jobN').appendTo('#dayViewN'); 

Answer 2

Thay vì thay thế div mới, tại sao không tắt tính năng kéo được?

$(element).draggable('disable'); 

Sau đó, khi bạn muốn nó được kéo agian, sử dụng này

$(element).draggable('enable');