[ASK] Draggable overflow scroll

[budimanlai]

Hi All,

I have a tree and 1 div container for drag and drop. the node can drag and drop to this container.
after the node drop to container, it will change to div box (have a table name, list of fields, list of primary key, etc). we can drag this box also inside div container.
the problem is if i move (drag) div box and the div box area through div container area, the div container not show scrollbar.

my question is how to make jeasyui draggable like jquery-ui draggable.

example:
http://jqueryui.com/draggable/ --> choose "default functionality"
you can drag the box and if the box through the container, the container automatically show scrollbar.

sorry for my bad english

regards,
Budiman

[stworthy]

Add 'position:relative;overflow:auto' style to the div container and you will be able to drag a element within this container.

Code:

<div style="position:relative;border:1px solid #ccc;width:400px;height:400px;overflow:auto">
	<div class="easyui-draggable" style="width:150px;height:150px;border:1px solid #ccc;background:#fafafa">
		<p>Drag me</p>
	</div>
</div>

[budimanlai]

Add 'position:relative;overflow:auto' style to the div container and you will be able to drag a element within this container.

Code:

<div style="position:relative;border:1px solid #ccc;width:400px;height:400px;overflow:auto">
	<div class="easyui-draggable" style="width:150px;height:150px;border:1px solid #ccc;background:#fafafa">
		<p>Drag me</p>
	</div>
</div>

Wow, cool. worked. thanks

[budimanlai]

Hi stworthy,

Now, I develop some application like MySQL WorkBench which I use jeasyui for UI Layout and jsPlumb as draggable table element (every table can connect to other table and every table can draggable). jsPlumb use jQuery-UI Draggable plugins for his draggable handle.

How to combine jeasyui (draggable) with jsplumb (draggable)?

Regards,