I''m trying to drag and drop images. The dragging part is fine, but
when I drop an image on the drop target, nothing happens (meaning my
Ajax call is never invoked and the image does not revert back to it''s
original position until I try to move it again). Here''s the code
I''m
using to create my draggables:
<% for photo in @photos %>
<div style="float: left; margin-left: 10px;"
id="photo-<%=
photo.id %>">
<%=
image_tag("#{photo.image_url.chomp(''.jpeg'')}
m.jpeg", :border => "1") %>
</div>
<%= draggable_element "photo-#{photo.id}", :revert =>
"true" %>
<% end %>
And here''s my drop target (specified in a partial):
<div id="drop-target" style="width: 100px; height: 100px;
border:
thin solid black; background-color: #eee;">
DROP TARGET
</div>
<%= drop_receiving_element("drop-target", :url => { :controller
=>
"photos", :action => "list" }, :accept =>
"photos" ) %>
I tried various combinations of drop_receiving_element parameters,
including with and without the :accept parameter, but all to no avail.
david
Doesn''t your photo div need to be of class "photos" to match up with the accept option to drop_receiving_element? -d. On 8/2/05, David Geary <sabreware-ihVZJaRskl1bRRN4PJnoQQ@public.gmane.org> wrote:> I''m trying to drag and drop images. The dragging part is fine, but > when I drop an image on the drop target, nothing happens (meaning my > Ajax call is never invoked and the image does not revert back to it''s > original position until I try to move it again). Here''s the code I''m > using to create my draggables: > > <div style="float: left; margin-left: 10px;" id="photo-<%> photo.id %>"> > <%= image_tag("#{photo.image_url.chomp(''.jpeg'')} > m.jpeg", :border => "1") %> > </div>
Le 05-08-02 à 10:56, Dan Peterson a écrit :> Doesn''t your photo div need to be of class "photos" to match up with > the accept option to drop_receiving_element?I have a bunch of divs, with classes "photo-1", "photo-2", ... ,"photo-n". I tried various :accept options, including leaving out the accept option altogether. None of them worked. david> > -d. > > On 8/2/05, David Geary <sabreware-ihVZJaRskl1bRRN4PJnoQQ@public.gmane.org> wrote: > >> I''m trying to drag and drop images. The dragging part is fine, but >> when I drop an image on the drop target, nothing happens (meaning my >> Ajax call is never invoked and the image does not revert back to it''s >> original position until I try to move it again). Here''s the code I''m >> using to create my draggables: >> >> <div style="float: left; margin-left: 10px;" id="photo-<%>> photo.id %>"> >> <%= image_tag("#{photo.image_url.chomp(''.jpeg'')} >> m.jpeg", :border => "1") %> >> </div> >> > _______________________________________________ > Rails mailing list > Rails-1W37MKcQCpIf0INCOvqR/iCwEArCW2h5@public.gmane.org > http://lists.rubyonrails.org/mailman/listinfo/rails >
I see id="photo-x" in your div. Try adding class="photos". -d. On 8/2/05, David Geary <sabreware-ihVZJaRskl1bRRN4PJnoQQ@public.gmane.org> wrote:> I have a bunch of divs, with classes "photo-1", > "photo-2", ... ,"photo-n". > > I tried various :accept options, including leaving out the accept > option altogether. None of them worked.
Le 05-08-02 à 14:57, Dan Peterson a écrit :> I see id="photo-x" in your div. Try adding class="photos".Thanks Dan, but that doesn''t work either. To eliminate all extraneous variables, I''ve implemented the most simple dnd app I can think of with one puny controller, a single view, a single draggable, and a lone drop target. And I still see the same results: my Ajax call for the drop target is never invoked when I drop my draggable on it. Here''s all of my code: Here''s my controller: class DragController < ApplicationController def index end def drop logger.info("DROPPING"); end end Here''s my view (views/drag/index.rhtml): <html> <head> <%= javascript_include_tag "prototype" %> <%= javascript_include_tag "dragdrop" %> </head> <body> <h3>Drag and Drop</h3> <p> <div id="drag"> <%= image_tag("images/my_image.jpeg") %> </div> <%= draggable_element("drag") %> <div id="droptarget" style="width: 100%; height: 300px; background-color: #eee; border: thin solid black"> DROP TARGET </div> <%= drop_receiving_element("droptarget", :url => { :controller => "drag", :action => "drop" }) %> </body> </html> When I drop the image on the drop target, the image disappears but the drag controller''s drop method is never invoked (at least I never see DROPPING in the development log file). If I change the draggable to be <%= draggable_element("drag", :revert => true) %> then when I drop the image it stays where it''s at and once again, the Ajax method is never called. Finally, when I have :revert => true, if I try to drag the image a second time after dropping it, it quickly zooms back to its starting location. This all seems pretty whacky to me. btw, drop_receiving_element is a horrible name for that method. Why not just drop_target? david
* David Geary <sabreware-ihVZJaRskl1bRRN4PJnoQQ@public.gmane.org> [Aug 02. 2005 18:40]:> I''m trying to drag and drop images. The dragging part is fine, but > when I drop an image on the drop target, nothing happens (meaning my > Ajax call is never invoked and the image does not revert back to it''s > original position until I try to move it again). Here''s the code I''m > using to create my draggables:[...]> > <%= drop_receiving_element("drop-target", :url => { :controller => > "photos", :action => "list" }, :accept => "photos" ) %>Add the :hoverclass parameter (i.e. :hoverclass => "drophover") to drop_receiving_element(). Its a know bug and already fixed in SVN. Klaus
Thanks for the suggestion, Klaus. My Ajax method is now being called, but I''m still seeing problems with images reverting back to their original position when :revert => true. The :hoverclass attribute doesn''t seem to change the CSS class of the div specified as the drop target, either. This will be a very useful once the bugs have been ironed out. david Le 05-08-03 à 01:59, Klaus Kaempf a écrit :> * David Geary <sabreware-ihVZJaRskl1bRRN4PJnoQQ@public.gmane.org> [Aug 02. 2005 18:40]: > >> I''m trying to drag and drop images. The dragging part is fine, but >> when I drop an image on the drop target, nothing happens (meaning my >> Ajax call is never invoked and the image does not revert back to it''s >> original position until I try to move it again). Here''s the code I''m >> using to create my draggables: >> > > [...] > >> >> <%= drop_receiving_element("drop-target", :url => { :controller => >> "photos", :action => "list" }, :accept => "photos" ) %> >> > > > Add the :hoverclass parameter (i.e. :hoverclass => "drophover") > to drop_receiving_element(). > > Its a know bug and already fixed in SVN. > > Klaus > _______________________________________________ > Rails mailing list > Rails-1W37MKcQCpIf0INCOvqR/iCwEArCW2h5@public.gmane.org > http://lists.rubyonrails.org/mailman/listinfo/rails >
* David Geary <sabreware-ihVZJaRskl1bRRN4PJnoQQ@public.gmane.org> [Aug 03. 2005 19:43]:> Thanks for the suggestion, Klaus. My Ajax method is now being called, > but > I''m still seeing problems with images reverting back to their > original position > when :revert => true.Huh ? Reverting back to their original position is the purpose of setting :revert => true (i.e. for shopping carts). If you want to move single items, use :revert => false.> The :hoverclass attribute doesn''t seem to > change the CSS class of the div specified as the drop target, either.You probably need to define a :hover declaration in your .css file for the element. The :hoverclass attribute then defines which element should be switched to the ''hovered'' state. The shopping cart demo at http://script.aculo.us/drag-and-drop shows this quite nicely. Klaus