Looking to imitate the WUFOO builder screen. I want to have a list of text items in one column, and when you drag them into a list in another column it shows a big dotted line box and you can drop it to add an input there. I can do the adding of the item to the list, I just do not know how to make a draggable item crate a box in the list to show where you will be adding. Thanks. --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
Take a look at Droppables.add, specifically the hoverclass property. Creating a (class) style that has your big dotted line border, then assigning that className to the hoverclass option should do the trick. Walter On Mar 18, 2008, at 5:26 PM, Louis W wrote:> > Looking to imitate the WUFOO builder screen. > > I want to have a list of text items in one column, and when you drag > them into a list in another column it shows a big dotted line box and > you can drop it to add an input there. > > I can do the adding of the item to the list, I just do not know how to > make a draggable item crate a box in the list to show where you will > be adding. > > Thanks. >--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
Thanks Walter. If I am dragging the item into a list, will that also make the two items which I am dragging between space out to show you where you are putting it? On Mar 19, 8:12 am, Walter Lee Davis <wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org> wrote:> Take a look at Droppables.add, specifically the hoverclass property. > Creating a (class) style that has your big dotted line border, then > assigning that className to the hoverclass option should do the trick. > > Walter > > On Mar 18, 2008, at 5:26 PM, Louis W wrote: > > > > > Looking to imitate the WUFOO builder screen. > > > I want to have a list of text items in one column, and when you drag > > them into a list in another column it shows a big dotted line box and > > you can drop it to add an input there. > > > I can do the adding of the item to the list, I just do not know how to > > make a draggable item crate a box in the list to show where you will > > be adding. > > > Thanks.--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
I find that there is already some of that behavior, at least in every sortable list implementation I have done. Perhaps this is a side- effect of my default list styles. If you add some margin to the hoverclass, maybe that would do the trick. I noticed that there were some issues with nested lists, but it works very neatly "on the flats". Walter On Mar 19, 2008, at 10:06 AM, Louis W wrote:> > Thanks Walter. If I am dragging the item into a list, will that also > make the two items which I am dragging between space out to show you > where you are putting it? > > >--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
Hi, I worked up a quick attempt at this. Can not seem to get it to do what I want. Please check it out. http://www.louiswalch.com/beta/drag_list.php Let me know if you need me to explain better what I am trying to do. On Mar 19, 10:17 am, Walter Lee Davis <wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org> wrote:> I find that there is already some of that behavior, at least in every > sortable list implementation I have done. Perhaps this is a side- > effect of my default list styles. If you add some margin to the > hoverclass, maybe that would do the trick. I noticed that there were > some issues with nested lists, but it works very neatly "on the flats". > > Walter > > On Mar 19, 2008, at 10:06 AM, Louis W wrote: > > > > > Thanks Walter. If I am dragging the item into a list, will that also > > make the two items which I am dragging between space out to show you > > where you are putting it?--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
First off, you need to give each of your LIs an ID. I don''t think
this will work properly as you have it, certainly you won''t be able
to persist any changes back without an ID to represent the order to
your server.
Second, you haven''t defined the class style for your drop area at
all, unless it''s in some external CSS that I didn''t look for.
Third, you have the hoverclass property commented out in the
Sortable, and not defined in the Droppable. The default in Droppable
is ''none'', so you aren''t going to get any magick from
the defaults,
either.
Try adding:
.hover { border: 3px dotted #598e4c }
...to your CSS.
Then add hoverclass: hover to your Droppables.add call in the options
hash.
Walter
On Mar 19, 2008, at 10:58 AM, Louis W wrote:
>
> Hi, I worked up a quick attempt at this. Can not seem to get it to do
> what I want. Please check it out.
>
> http://www.louiswalch.com/beta/drag_list.php
>
> Let me know if you need me to explain better what I am trying to do.
>
>
>
> On Mar 19, 10:17 am, Walter Lee Davis
<wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org> wrote:
>> I find that there is already some of that behavior, at least in every
>> sortable list implementation I have done. Perhaps this is a side-
>> effect of my default list styles. If you add some margin to the
>> hoverclass, maybe that would do the trick. I noticed that there were
>> some issues with nested lists, but it works very neatly "on the
>> flats".
>>
>> Walter
>>
>> On Mar 19, 2008, at 10:06 AM, Louis W wrote:
>>
>>
>>
>>> Thanks Walter. If I am dragging the item into a list, will that
also
>>> make the two items which I am dragging between space out to show
you
>>> where you are putting it?
> >
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
Hi, thanks for the help so far. I added the hover class for the droppable and its appearing. It is adding a box around the entire LI (which is what its designed to do). I am looking for it to do when you are dragging and item into the list: http://www.louiswalch.com/beta/drop.jpg Do I have to create droppable zones between each li item? On Mar 19, 12:03 pm, Walter Lee Davis <wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org> wrote:> First off, you need to give each of your LIs an ID. I don''t think > this will work properly as you have it, certainly you won''t be able > to persist any changes back without an ID to represent the order to > your server. > > Second, you haven''t defined the class style for your drop area at > all, unless it''s in some external CSS that I didn''t look for. > > Third, you have the hoverclass property commented out in the > Sortable, and not defined in the Droppable. The default in Droppable > is ''none'', so you aren''t going to get any magick from the defaults, > either. > > Try adding: > > .hover { border: 3px dotted #598e4c } > > ...to your CSS. > > Then add hoverclass: hover to your Droppables.add call in the options > hash. > > Walter > > On Mar 19, 2008, at 10:58 AM, Louis W wrote: > > > > > Hi, I worked up a quick attempt at this. Can not seem to get it to do > > what I want. Please check it out. > > >http://www.louiswalch.com/beta/drag_list.php > > > Let me know if you need me to explain better what I am trying to do. > > > On Mar 19, 10:17 am, Walter Lee Davis <wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org> wrote: > >> I find that there is already some of that behavior, at least in every > >> sortable list implementation I have done. Perhaps this is a side- > >> effect of my default list styles. If you add some margin to the > >> hoverclass, maybe that would do the trick. I noticed that there were > >> some issues with nested lists, but it works very neatly "on the > >> flats". > > >> Walter > > >> On Mar 19, 2008, at 10:06 AM, Louis W wrote: > > >>> Thanks Walter. If I am dragging the item into a list, will that also > >>> make the two items which I am dragging between space out to show you > >>> where you are putting it?--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
Have a look at this site: http://tankut.googlepages.com/home This is a modified version of dragdrop.js that lets you see a drop zone target. Not sure if this will work for you. Also not sure why this has to be done in this manner, and can''t be patched up with an extension rather than a completely re-worked library file. Walter On Mar 19, 2008, at 12:49 PM, Louis W wrote:> > Hi, thanks for the help so far. > I added the hover class for the droppable and its appearing. It is > adding a box around the entire LI (which is what its designed to do). > > I am looking for it to do when you are dragging and item into the > list: > http://www.louiswalch.com/beta/drop.jpg > > Do I have to create droppable zones between each li item? > > > > > On Mar 19, 12:03 pm, Walter Lee Davis <wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org> wrote: >> First off, you need to give each of your LIs an ID. I don''t think >> this will work properly as you have it, certainly you won''t be able >> to persist any changes back without an ID to represent the order to >> your server. >> >> Second, you haven''t defined the class style for your drop area at >> all, unless it''s in some external CSS that I didn''t look for. >> >> Third, you have the hoverclass property commented out in the >> Sortable, and not defined in the Droppable. The default in Droppable >> is ''none'', so you aren''t going to get any magick from the defaults, >> either. >> >> Try adding: >> >> .hover { border: 3px dotted #598e4c } >> >> ...to your CSS. >> >> Then add hoverclass: hover to your Droppables.add call in the options >> hash. >> >> Walter >> >> On Mar 19, 2008, at 10:58 AM, Louis W wrote: >> >> >> >>> Hi, I worked up a quick attempt at this. Can not seem to get it >>> to do >>> what I want. Please check it out. >> >>> http://www.louiswalch.com/beta/drag_list.php >> >>> Let me know if you need me to explain better what I am trying to do. >> >>> On Mar 19, 10:17 am, Walter Lee Davis <wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org> wrote: >>>> I find that there is already some of that behavior, at least in >>>> every >>>> sortable list implementation I have done. Perhaps this is a side- >>>> effect of my default list styles. If you add some margin to the >>>> hoverclass, maybe that would do the trick. I noticed that there >>>> were >>>> some issues with nested lists, but it works very neatly "on the >>>> flats". >> >>>> Walter >> >>>> On Mar 19, 2008, at 10:06 AM, Louis W wrote: >> >>>>> Thanks Walter. If I am dragging the item into a list, will that >>>>> also >>>>> make the two items which I am dragging between space out to >>>>> show you >>>>> where you are putting it? > >--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
Thanks Walter I will check it out.
I am currently pouring through the wufoo.com js files for their form
builder to try and see how they are doing it. What is odd is I can not
find where the draggable is actually getting instated.
I did find this which is shedding a little light
,dragToAddPlaceHolder:function(){
if(DRAGPOS==$(''formFields'').childNodes.length-1){
new
Insertion.Bottom($(''formFields''),''<
li id="dragHolder" class="dragfld">
</li>'');
DRAGPOS=DRAGPOS+1;
}
else new Insertion.Before($
(''formFields'').childNodes[DRAGPOS],''<
li id="dragHolder" class="dragfld">
</li>'');
}
On Mar 19, 2:56 pm, Walter Lee Davis
<wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org>
wrote:> Have a look at this site:
>
> http://tankut.googlepages.com/home
>
> This is a modified version of dragdrop.js that lets you see a drop
> zone target. Not sure if this will work for you. Also not sure why
> this has to be done in this manner, and can''t be patched up with
an
> extension rather than a completely re-worked library file.
>
> Walter
>
> On Mar 19, 2008, at 12:49 PM, Louis W wrote:
>
>
>
> > Hi, thanks for the help so far.
> > I added the hover class for the droppable and its appearing. It is
> > adding a box around the entire LI (which is what its designed to do).
>
> > I am looking for it to do when you are dragging and item into the
> > list:
> >http://www.louiswalch.com/beta/drop.jpg
>
> > Do I have to create droppable zones between each li item?
>
> > On Mar 19, 12:03 pm, Walter Lee Davis
<wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org> wrote:
> >> First off, you need to give each of your LIs an ID. I
don''t think
> >> this will work properly as you have it, certainly you
won''t be able
> >> to persist any changes back without an ID to represent the order
to
> >> your server.
>
> >> Second, you haven''t defined the class style for your drop
area at
> >> all, unless it''s in some external CSS that I
didn''t look for.
>
> >> Third, you have the hoverclass property commented out in the
> >> Sortable, and not defined in the Droppable. The default in
Droppable
> >> is ''none'', so you aren''t going to get
any magick from the defaults,
> >> either.
>
> >> Try adding:
>
> >> .hover { border: 3px dotted #598e4c }
>
> >> ...to your CSS.
>
> >> Then add hoverclass: hover to your Droppables.add call in the
options
> >> hash.
>
> >> Walter
>
> >> On Mar 19, 2008, at 10:58 AM, Louis W wrote:
>
> >>> Hi, I worked up a quick attempt at this. Can not seem to get
it
> >>> to do
> >>> what I want. Please check it out.
>
> >>>http://www.louiswalch.com/beta/drag_list.php
>
> >>> Let me know if you need me to explain better what I am trying
to do.
>
> >>> On Mar 19, 10:17 am, Walter Lee Davis
<wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org> wrote:
> >>>> I find that there is already some of that behavior, at
least in
> >>>> every
> >>>> sortable list implementation I have done. Perhaps this is
a side-
> >>>> effect of my default list styles. If you add some margin
to the
> >>>> hoverclass, maybe that would do the trick. I noticed that
there
> >>>> were
> >>>> some issues with nested lists, but it works very neatly
"on the
> >>>> flats".
>
> >>>> Walter
>
> >>>> On Mar 19, 2008, at 10:06 AM, Louis W wrote:
>
> >>>>> Thanks Walter. If I am dragging the item into a list,
will that
> >>>>> also
> >>>>> make the two items which I am dragging between space
out to
> >>>>> show you
> >>>>> where you are putting it?
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---