Droppable nested list and sortable table.
Hello.
I am quite new to both jQuery and jQuery UI and I hope I can get some
help here. I've read the documentation but for my current issue I
can't seem to find help there.
What I am trying to do is co create a file manager like webpage with
drag and drop. The idea is to have a table which represents the
content on the right side, and a nested list on the left side which
represents the directory structure. The table-rows on the right side
should be sortable. The directory structure is droppable as I want to
drag table-rows from one directory into another.
A basic example can be viewed at here: http://novus3.laboremus.no/dnd_jquery_example.html
This example alerts the user of the changes when mouse button is
released after dragging a table-row. In Firefox 2, Firefox 3 and
Safari this example works just as intended. However, in IE7 and Opera
there seems to be some issues.
IE7:
-When dragging a table-row the helper is not displayed as intended
-When dropping a table-row into a nested li-element the drop function
of the parent li-element is called before the drop function of the
intended li-element is called. I do not desire the parent li-element
to be called at all.
Opera:
-The table does not become sortable.
The code might be to much to paste here, but to summarize the table is
sortable and all li-elements are droppable. An li-element that is
parent of another list has a clickable fields which expands/collapses
the nested lists. The code can be viewed in the following files:
xhtml: http://novus3.laboremus.no/dnd_jquery_example.html
css: http://novus3.laboremus.no/jquery_example.css
javascript/jquery: http://novus3.laboremus.no/scripts/i_use_jquery_example.js
Can anyone help me with solving the issues arising in IE7 or Opera?
Thx, Magnus