I''ve successfully setup some drag-and-drop categorization in a new app I''m working on, though I''m getting tripped up by Prototype accessors it seems. On complete of the drag and drop process, I want to change the background color of a div nested inside the main div defined as the draggable_element. Here''s a sample from the view... <% entry_id = "entry_#{entry.id}" %> <div class="<%= cycle(''odd'', ''even'') %>" id="<%= entry_id %>"> <div class="entry_cat"> </div> .... On complete of the drag and drop, I want to change the background color of "entry_cat," though I''m having trouble accessing it. :complete => "alert(''here is the entry id: '' + element.id)" - successfully gets me the element id of the div I dragged, which is good... I would expect to be able to use something like this to change the background color of "entry_cat" but it doesn''t work... :complete => "element.getElementsByClassName(''entry_cat'').setStyle({backgroundColor: ''red''})" What am I doing wrong? How would I access the "entry_cat" div for the dragged element and update the background color? Any help would be greatly appreciated. Thanks, -Alex --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group. To post to this group, send email to rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-talk?hl=en -~----------~----~----~----~------~----~------~--~---
I think you should try using with id="entry_cat" and then use getElementById(''entry_cat'') to change the color of the <div> On Aug 26, 10:37 pm, ressister <ressis...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> I''ve successfully setup some drag-and-drop categorization in a new app > I''m working on, though I''m getting tripped up by Prototype accessors > it seems. > > On complete of the drag and drop process, I want to change the > background color of a div nested inside the main div defined as the > draggable_element. > > Here''s a sample from the view... > > <% entry_id = "entry_#{entry.id}" %> > <div class="<%= cycle(''odd'', ''even'') %>" id="<%= entry_id %>"> > <div class="entry_cat"> </div> > .... > > On complete of the drag and drop, I want to change the background > color of "entry_cat," though I''m having trouble accessing it. > > :complete => "alert(''here is the entry id: '' + element.id)" - > successfully gets me the element id of the div I dragged, which is > good... > > I would expect to be able to use something like this to change the > background color of "entry_cat" but it doesn''t work... > > :complete => > "element.getElementsByClassName(''entry_cat'').setStyle({backgroundColor: > ''red''})" > > What am I doing wrong? How would I access the "entry_cat" div for the > dragged element and update the background color? > > Any help would be greatly appreciated. > > Thanks, > -Alex--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group. To post to this group, send email to rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-talk?hl=en -~----------~----~----~----~------~----~------~--~---
Hi Ashutosh, I tried that and it didn''t work. Here''s what I''ve done so far with what''s worked and what hasn''t. "entry_cat" is setup now as a div with an id, rather then a class. I''m trying, on :complete, to simply pop an alert window with something to indicate success (i.e. that i''m actually accessing the entry_cat id which is what I''m shooting for) and I''m clearly not getting it. This works to return the parent dragabble div''s ID :complete => "alert(''here is the entry id: '' + element.id)" - returns for instance, ''entry_4'' These both fail: :complete => "alert(element.id.getElementById(''entry_cat'').getStyle(''background- color'') - failed, that''s clearly not the right accessor :complete => "alert(element.getElementById(''entry_cat'').getStyle(''background- color'') - failed, that''s clearly not the right accessor This works, but returns the first entry_cat on the page, not necessarily the one that belongs to the dragged div :complete => "alert($(''entry_cat'').getStyle(''background-color''))" - this works, but gives me the first one, not necessarily the one associated with the div I dragged Looking to access div:entry_4 -> div:entry_cat Any other ideas? -A On Aug 26, 2:36 pm, Ashutosh <ashutosh...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> I think you should try using with id="entry_cat" and then use > getElementById(''entry_cat'') to change the color of the <div> > > On Aug 26, 10:37 pm, ressister <ressis...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > > I''ve successfully setup some drag-and-drop categorization in a new app > > I''m working on, though I''m getting tripped up by Prototype accessors > > it seems. > > > On complete of the drag and drop process, I want to change the > > background color of a div nested inside the main div defined as the > > draggable_element. > > > Here''s a sample from the view... > > > <% entry_id = "entry_#{entry.id}" %> > > <div class="<%= cycle(''odd'', ''even'') %>" id="<%= entry_id %>"> > > <div class="entry_cat"> </div> > > .... > > > On complete of the drag and drop, I want to change the background > > color of "entry_cat," though I''m having trouble accessing it. > > > :complete => "alert(''here is the entry id: '' + element.id)" - > > successfully gets me the element id of the div I dragged, which is > > good... > > > I would expect to be able to use something like this to change the > > background color of "entry_cat" but it doesn''t work... > > > :complete => > > "element.getElementsByClassName(''entry_cat'').setStyle({backgroundColor: > > ''red''})" > > > What am I doing wrong? How would I access the "entry_cat" div for the > > dragged element and update the background color? > > > Any help would be greatly appreciated. > > > Thanks, > > -Alex--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group. To post to this group, send email to rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-talk+unsubscribe@googlegroups.com For more options, visit this group at http://groups.google.com/group/rubyonrails-talk?hl=en -~----------~----~----~----~------~----~------~--~---
Couple of questions, what are your ''draggable_element''s and ''drop_receiving_element''? If you want to highlight the specific entry you''ve edited you''ll likely want to setup some RJS in your controller instead of in the complete line... If you want to highlight a div not associated with a specific entry id... :complete => "$(''div_id_to_highlight'').addClassName(''active'');" Otherwise in your controller in the update method respond_to do |format| format.js { render :update do |page| page.visual_effect :highlight, "entry_#{@entry.id}" end } end --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group. To post to this group, send email to rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-talk?hl=en -~----------~----~----~----~------~----~------~--~---
Hi Dave, Let me answer you questions to see if you can help... I have a number of categories, listed in at _categories.html.erb template. Here''s how they''re generated in the template (this is where the drop takes place): <% for category in @categories %> <li id="<%= category.category.name %>" style="background: <%category.category.color %>;"><%= link_to category.category.name, :controller => ''categories'', :action => ''index'', :id => category.category.name %></li> <%drop_receiving_element(category.category.name, :onHover => "function() { $ (''#{category.category.name}'').highlight() }", :with => "''entry='' + (element.id.split(''_'').last()) + ''&user='' + #{@user} + ''&category='' + #{category.category.id}", :url => {:action =>:entry_categorize}, :complete => "?" )%> <% end %> I put a "?" for the complete action, because I don''t know what to do here. I want the complete action to change the background color of "entry_cat" below to match the category background color. Here is where the entries are generated. These are the draggables: <% for entry in entries %> <% entry_id = "entry_#{entry.id}" %> <div class="<%= cycle(''odd'', ''even'') %>" id="<%= entry_id %>"> <div id="entry_cat" class="float_left" <% unless entry.entry_category.nil? %> style="background-color: <%= entry.entry_category.category.color %>;" <% end %>> </div> <span class="entry_time"> <%=h entry.created_at.to_s(:time) %> </span> <span class="entry_name"> <%=h entry.item_name %> </span> <span> <%= entry.price %> </span> </div> <div class="clear"></div> <%= draggable_element(entry_id, :revert=>true) %> <% end %> <% end %> How would I go about updating the ''entry_cat'' background color on complete of a successful drag and drop for the specific entry that was dragged only? This is where I''m having trouble. Let me know if you have any other questions and thanks for the help so far. Thanks, -A On Aug 27, 7:21 am, Dave S <DaveSh...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> Couple of questions, what are your ''draggable_element''s and > ''drop_receiving_element''? If you want to highlight the specific entry > you''ve edited you''ll likely want to setup some RJS in your controller > instead of in the complete line... > > If you want to highlight a div not associated with a specific entry > id... > :complete => "$(''div_id_to_highlight'').addClassName(''active'');" > > Otherwise in your controller in the update method > > respond_to do |format| > format.js { > render :update do |page| > page.visual_effect :highlight, "entry...-ZjckIOGIy2s@public.gmane.org}" > end > } > end--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group. To post to this group, send email to rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-talk+unsubscribe@googlegroups.com For more options, visit this group at http://groups.google.com/group/rubyonrails-talk?hl=en -~----------~----~----~----~------~----~------~--~---
? == $(#{entry_id}).setStyle({backgroundColor: ''#900''}); On Aug 27, 9:43 am, ressister <ressis...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> Hi Dave, > > Let me answer you questions to see if you can help... > > I have a number of categories, listed in at _categories.html.erb > template. Here''s how they''re generated in the template (this is where > the drop takes place): > > <% for category in @categories %> > <li id="<%= category.category.name %>" style="background: <%> category.category.color %>;"><%= link_to > category.category.name, :controller => ''categories'', :action => > ''index'', :id => category.category.name %></li> > > <%> drop_receiving_element(category.category.name, > :onHover => "function() { $ > (''#{category.category.name}'').highlight() }", > :with => "''entry='' + (element.id.split(''_'').last()) + > ''&user='' > + #{@user} + ''&category='' + > #{category.category.id}", > :url => {:action =>:entry_categorize}, > :complete => "?" > )%> > > <% end %> > > I put a "?" for the complete action, because I don''t know what to do > here. I want the complete action to change the background color of > "entry_cat" below to match the category background color. Here is > where the entries are generated. These are the draggables: > > <% for entry in entries %> > <% entry_id = "entry_#{entry.id}" %> > > <div class="<%= cycle(''odd'', ''even'') %>" id="<%= entry_id %>"> > <div id="entry_cat" class="float_left" > <% unless entry.entry_category.nil? %> > style="background-color: > <%= entry.entry_category.category.color %>;" > <% end %>> </div> > <span class="entry_time"> > <%=h entry.created_at.to_s(:time) %> > </span> > <span class="entry_name"> > <%=h entry.item_name %> > </span> > <span> > <%= entry.price %> > </span> > </div> > <div class="clear"></div> > > <%= draggable_element(entry_id, :revert=>true) %> > <% end %> > <% end %> > > How would I go about updating the ''entry_cat'' background color on > complete of a successful drag and drop for the specific entry that was > dragged only? This is where I''m having trouble. Let me know if you > have any other questions and thanks for the help so far. > > Thanks, > -A > > On Aug 27, 7:21 am, Dave S <DaveSh...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > > Couple of questions, what are your ''draggable_element''s and > > ''drop_receiving_element''? If you want to highlight the specific entry > > you''ve edited you''ll likely want to setup some RJS in your controller > > instead of in the complete line... > > > If you want to highlight a div not associated with a specific entry > > id... > > :complete => "$(''div_id_to_highlight'').addClassName(''active'');" > > > Otherwise in your controller in the update method > > > respond_to do |format| > > format.js { > > render :update do |page| > > page.visual_effect :highlight, "entry...-ZjckIOGIy2s@public.gmane.org}" > > end > > } > > end--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group. To post to this group, send email to rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-talk+unsubscribe@googlegroups.com For more options, visit this group at http://groups.google.com/group/rubyonrails-talk?hl=en -~----------~----~----~----~------~----~------~--~---