Forum: Ruby on Rails sortable_list added to by AJAX question

Announcement (2017-05-07): www.ruby-forum.com is now read-only since I unfortunately do not have the time to support and maintain the forum any more. Please see rubyonrails.org/community and ruby-lang.org/en/community for other Rails- und Ruby-related community platforms.
Marcus V. (Guest)
on 2006-02-23 07:48
I have a working sortable_list that is added to by AJAX. The problem is
that when a new item is added, it's not sortable. I found a post on
scriptaculous using behaviour.js to refresh the DOM when an item is
added, but I can't figure out how to do it with Rails.

To test the behaviour method, I used this:

 var myrules={
     'div#steps ul' : function(element) {
         Sortable.create('steps_list', {handle:'handle',
onUpdate:function(){new Ajax.Request('/goals/sort/4',
{asynchronous:true, evalScripts:true, onComplete:function(request){new
Effect.Highlight('steps_list',{});},
parameters:Sortable.serialize('steps_list')})}})
     }
 }
 Behaviour.register(myrules);

Then called Behaviour.apply(); every time a step was added to the goal.
It actually works to a point, but the problem lies in
Sortable.create--it's static and doesn't know which 'goal' I'm
attempting to sort.

How can I re-call sortable_view (or get the same effect) without
refreshing the entire page so it gets the items I added with AJAX?

Thanks...Marcus
Frederick R. (Guest)
on 2006-02-23 08:01
(Received via mailing list)
Marcus V. wrote :
| How can I re-call sortable_view (or get the same effect) without
| refreshing the entire page so it gets the items I added with AJAX?
|

Hi Marcus,

I had the same problem, and (almost) fixed it. Th epoint is to call
again the sortable_element when your new list item is added.

In my pet application I did this by:

  * using RJS templates are they are quite handy to describe th
    eJavascript you want to apply to your page
  * a patch I've done on Rails (ticket #3893) that add the
    sortable_element method to the JavaScriptGenerator (in order to
    avoid replicating the sortable_element in my RJS template).

Best Regards,
--
Frederick R. aka Sleeper -- removed_email_address@domain.invalid

Don't diddle code to make it faster - find a better algorithm.
            - The Elements of Programming Style (Kernighan & Plaugher)
Marcus V. (Guest)
on 2006-02-23 15:13
Frederick
Thanks! I spent hours, and after reading your email it takes me 5
minutes to finally fix it.

This is what I ended up doing:
I added:
<div id="sortable">
<%= render :partial => 'sortable_element', :locals => {:goal => @goal}
%>
</div>

to my view.

The partial just contains:
<%= sortable_element 'steps_list',
	:url => { :action => "sort", :id => goal},
	:complete => visual_effect(:highlight, 'steps_list'),
	:handle => "handle"%>

Then in my RJS file 'create_step' I added this:
page.replace_html 'sortable', :partial => 'sortable_element', :locals =>
{:goal => @goal}

Almost too simple a solution and no repeated code for the most part. The
only thing that bugs me is that it's yet another partial :) Hopefully
your patch will eleminate the need for that.

Thanks again,
Marcus

Frederick R. wrote:
> Marcus V. wrote :
> | How can I re-call sortable_view (or get the same effect) without
> | refreshing the entire page so it gets the items I added with AJAX?
> |
>
> Hi Marcus,
>
> I had the same problem, and (almost) fixed it. Th epoint is to call
> again the sortable_element when your new list item is added.
>
> In my pet application I did this by:
>
>   * using RJS templates are they are quite handy to describe th
>     eJavascript you want to apply to your page
>   * a patch I've done on Rails (ticket #3893) that add the
>     sortable_element method to the JavaScriptGenerator (in order to
>     avoid replicating the sortable_element in my RJS template).
>
> Best Regards,
> --
> Frederick R. aka Sleeper -- removed_email_address@domain.invalid
>
> Don't diddle code to make it faster - find a better algorithm.
>             - The Elements of Programming Style (Kernighan & Plaugher)
Frederick R. (Guest)
on 2006-02-23 15:21
(Received via mailing list)
Quoting Marcus V. <removed_email_address@domain.invalid>:


> Almost too simple a solution and no repeated code for the most part. The
> only thing that bugs me is that it's yet another partial :) Hopefully
> your patch will eleminate the need for that.

Nice to see at least I can help someone ;)
I do not know if my patch will be taken into accoutn. I do think that
several
other scriptaculous method should found their way through RJS ..



Frederick R. aka Sleeper -- removed_email_address@domain.invalid
Dave K. (Guest)
on 2006-04-05 12:21
(Received via mailing list)
Hi Marcus,

This is exactly what I need to do, but I am completely confused.  I
added what you said to add, and changed the values accordingly, but I
am pretty sure that I did it completely wrong or am missing the
implementation completely.  If you are willing to help me out on this
I would be extremely grateful.

Dave
Martin S. (Guest)
on 2006-04-05 15:49
Dave Krupinski wrote:
> Hi Marcus,
>
> This is exactly what I need to do, but I am completely confused.  I
> added what you said to add, and changed the values accordingly, but I
> am pretty sure that I did it completely wrong or am missing the
> implementation completely.  If you are willing to help me out on this
> I would be extremely grateful.
>
> Dave

not 100% related, but I'm sure the problem will pop up: If you want the
newly loaded sortable to be able to exchange draggables with existing
sortables, use this function:

var drop_containers=new Array();
function add_to_sortable_containments(element) {

 drop_containers.push($(element));
 Droppables.drops.each(function(d) { d._containers=drop_containers});

}
It updates the "containment" property of all droppables on the page to
the value of drop_containers.
This topic is locked and can not be replied to.