On 1/12/07, Matthew Kwiecien <[EMAIL PROTECTED]> wrote:
> Ah, sorry, just noticed your second reply. Yes, the ghosting thing is sadly
> a limitation. Like I said though, take a step back and ask if it is really
> tables that you need to use. If you're doing the whole sortable drag and
> drop thing (which, obviously, you are) more likely than not the answer is
> no. I doubt there are very many cases where it would be better to use
> "sortable drag and drop" on a table of data than to use "sortable tables" on
> it.
>
> For example, in a recent project I was doing, I was planning on being lazy
> and using DnD tables. But I wanted the ghosting. So I bit the bullet and
> used a list, wrapping a couple div's in each li, then sprinkled some CSS
> over it. In the end, it turned out better than the tables would ever have
> looked.
>
> Just my .02
>
>
> As for actually making ghosting work with tables, I'm not sure what would
> need to be done. I didn't even know, actually, that one of the toolkits had
> it working. Looking at the YUI example you linked, it seems, to me, a bit
> slow and clunky. Then again, I've never really liked YUI.
>
>
> On 1/12/07, Matthew Kwiecien <[EMAIL PROTECTED]> wrote:
> > Sorry if this sounds a little jerk-ish, because I don't mean it that way:
> > You have to actually define the handle for handles to work.
> >
> > Here's a working example (assuming you have everything included that you
> need to in the header):
> >
> > <table border=1>
> > <tbody id="line">
> > <tr id="Drag1">
> > <td style="cursor: move;" class="handle">Handle1</td>
> > <td>Asdf 1</td>
> > <td>Asdf 2</td>
> > <td>Asdf 3</td>
> > <td>Asdf 4</td>
> > </tr>
> > <tr id="Drag2">
> > <td style="cursor: move;" class="handle">Handle2</td>
> > <td>Asdf 1</td>
> > <td>Asdf 2</td>
> > <td>Asdf 3</td>
> > <td>Asdf 4</td>
> > </tr>
> > <tr id="Drag3">
> > <td style="cursor: move;" class="handle">Handle3</td>
> > <td>Asdf 1</td>
> > <td>Asdf 2</td>
> > <td>Asdf 3</td>
> > <td>Asdf 4</td>
> > </tr>
> > </tbody>
> > </table>
> > <script
> type="text/javascript">MochiKit.Sortable.Sortable.create('line',{tag:'tr',ghosting:false,handle:'handle'});</script>
> >
> >
> > Important note: Ghosting needs to be set to false, else things get a bit
> wonky. If that's an issue, I suggest you take a step back and ask yourself
> "Do I really NEED to be doing this with tables, or is there actually a
> better/easier way?".
> >
> > Cheers,
> > Matt
> >
> >
> >
> > On 1/12/07, Liu Fung Sin < [EMAIL PROTECTED]> wrote:
> > >
> > > Just FYI, in case any of you also want to implement something like
> > > this.
> > >
> > > I found the following example using YUI
> > >
> > >
> http://tech.groups.yahoo.com/group/ydn-javascript/messages/478?threaded=1&m=e&var=1&tidx=1
> > >
> > >
> https://secure0.forward-comp.co.uk/testtable/testtable.html
> > >
> > > The demo is rather cool!
> > >
> > > Although I have to say that Mochikit, Prototype and Dojo have a much
> > > nicer design than YUI (too verbose for my taste), it seems that they
> > > have a very active community with a lot more corner case examples.
> > >
> > > I'm not giving up on mochikit yet, if anyone can kindly help and point
> > > out what's missing in the picture :-)
I actually ran into almost exatly this problem a few months ago,
though I needed to drag cells, not rows. Still, I found it impossible
to implement with tables. So how to make fixed columns in a list?
<style type="text/css">
.left, .middle, .right {
display: block;
margin: 0 20px;
float: left;
width: 30px;
text-align: center;
}
.left {
clear: left;
}
</style>
<dl>
<dt class="left">one</dt>
<dd class="middle">oneA</dd>
<dd class="right">oneB</dd>
<dt class="left">two</dt>
<dd class="middle">twoA</dd>
<dd class="right">twoB</dd>
</dl>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"MochiKit" 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/mochikit?hl=en
-~----------~----~----~----~------~----~------~--~---
