Here's an example markup, which looks like a regular table if you add in some
css:
<div class="headers">
<div class="headeritem">id</div>
<div class="headeritem">name</div>
<div class="headeritem">address</div>
<div class="headeritem">phone</div>
</div>
<div class="scroller"> <!--this just acts as an overflow:hidden container
its child-->
<div class="grid">
<div class="row" style="top:0px">
<div class="col c0">1</div>
<div class="col c1">John Smith</div>
<div class="col c2">123 Oak Street</div>
<div class="col c3">555-123-4567</div>
</div>
<!--more rows here-->
</div>
</div>
I can easily do a $('.header').sortable() and drag a header around with a
placeholder in its spot. When I begin to drag "name," a placeholder class
designed to look like an empty space takes its place
(forcePlaceholderSize=true). If I drag "name" slightly farther to the right,
"address" shifts, and the placeholder moves there.
So far so good. The rest I havent tried yet -slash- dont know how.
For this case of dragging "name," I'd also like $('.c1'), corresponding to
the columns with names in them, to act like placeholders. My plan is to:
1) on "start:", give all ".c1"s the placeholder class, so now the entire
column looks 'blank'
2) helper returns a clone with a small number of entries from the "name"
column copied into it.
3) So now I'm holding onto the "name" header with "John Smith" and 4 other
results below it in a little window, and the entire column looks like a
placeholder. When I drag to the right, over "address," the headers will
re-order, since they were declared sortable, but how do I make the <div
class="grid"> columns mimic this motion? I want this to occur whether the
mouse is over my <div class="headers"> or <div class="grid">
--
View this message in context:
http://www.nabble.com/sortable%28%29-with-weird-DOM-tp24457357s27240p24457357.html
Sent from the jQuery UI Discussion mailing list archive at Nabble.com.
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
