I have an interesting challenge for you. I am using both Scriptaculous
and Prototype on a web site (not using Ruby) and I am trying to queue
effects and updates. Here is the situation - I have a page with
editable blocks, when the user clicks on the edit button under the
box, I want it to:
1) Use Ajax to go out and get the code to build the editor form.
2) When it has the form, use Effect.BlindUp to hide the div object.
3) Use Element.Update to change the contents of the div object.
4) Finally, use Effect.BlindDown to show the updated div object.
So, I have this - and please assume that variables used in the code
snippet below are defined in non-quoted parts of this code:
<code>
new Ajax.Request(url, {
method: ''get'',
onFailure: function(transport)
{
$("update_message").update(transport.statusText);
},
onSuccess: function(transport)
{
new Effect.BlindUp(content, {queue: ''front'', scope: id} );
new Element.update(content,transport.responseText, {queue:
''end'',
scope: id} );
new Effect.BlindDown(content, {queue: ''end'', scope: id} );
}
});
</code>
And it works OK, except that it does the actions in 1-3-2-4 order,
meaning it gets the editor form, updates the contents of the DIV tag,
then blinds up, then blinds down. Kind of the wrong effect, but
otherwise the AJAX functions work fine, the update works fine, and the
effects work fine, just in the wrong order.
My question is, am I unable to put the Prototype update() function in
a queue? That seems to be the problem.
--~--~---------~--~----~------------~-------~--~----~
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
-~----------~----~----~----~------~----~------~--~---
this should work:
...
onSuccess: function(transport) {
new Effect.BlindUp(content, {
afterFinish: function() {
content.update(transport.responseText);
new Effect.BlindDown(content);
}
});
...
Shane Lambert wrote:>
>
> I have an interesting challenge for you. I am using both Scriptaculous
> and Prototype on a web site (not using Ruby) and I am trying to queue
> effects and updates. Here is the situation - I have a page with
> editable blocks, when the user clicks on the edit button under the
> box, I want it to:
>
> 1) Use Ajax to go out and get the code to build the editor form.
> 2) When it has the form, use Effect.BlindUp to hide the div object.
> 3) Use Element.Update to change the contents of the div object.
> 4) Finally, use Effect.BlindDown to show the updated div object.
>
> So, I have this - and please assume that variables used in the code
> snippet below are defined in non-quoted parts of this code:
>
> <code>
> new Ajax.Request(url, {
> method: ''get'',
> onFailure: function(transport)
> {
> $("update_message").update(transport.statusText);
> },
> onSuccess: function(transport)
> {
> new Effect.BlindUp(content, {queue: ''front'', scope:
id} );
> new Element.update(content,transport.responseText, {queue:
''end'',
> scope: id} );
> new Effect.BlindDown(content, {queue: ''end'', scope:
id} );
> }
> });
> </code>
>
> And it works OK, except that it does the actions in 1-3-2-4 order,
> meaning it gets the editor form, updates the contents of the DIV tag,
> then blinds up, then blinds down. Kind of the wrong effect, but
> otherwise the AJAX functions work fine, the update works fine, and the
> effects work fine, just in the wrong order.
>
> My question is, am I unable to put the Prototype update() function in
> a queue? That seems to be the problem.
>
>
> >
>
>
--
View this message in context:
http://www.nabble.com/Help-with-effect-queue.-tf3934300.html#a11159113
Sent from the RubyOnRails Spinoffs mailing list archive at Nabble.com.
--~--~---------~--~----~------------~-------~--~----~
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 second that, the use of a call back on the first effect is essential. I am pretty sure element.update does coordinate with the Effect Queue. The necessary "closing" effect must be nested inside that callback as well. On Jun 16, 7:38 pm, kangax <kan...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> this should work: > > ... > onSuccess: function(transport) { > new Effect.BlindUp(content, { > afterFinish: function() { > content.update(transport.responseText); > new Effect.BlindDown(content); > }}); > > ... > > > > Shane Lambert wrote: > > > I have an interesting challenge for you. I am using both Scriptaculous > > and Prototype on a web site (not using Ruby) and I am trying to queue > > effects and updates. Here is the situation - I have a page with > > editable blocks, when the user clicks on the edit button under the > > box, I want it to: > > > 1) Use Ajax to go out and get the code to build the editor form. > > 2) When it has the form, use Effect.BlindUp to hide the div object. > > 3) Use Element.Update to change the contents of the div object. > > 4) Finally, use Effect.BlindDown to show the updated div object. > > > So, I have this - and please assume that variables used in the code > > snippet below are defined in non-quoted parts of this code: > > > <code> > > new Ajax.Request(url, { > > method: ''get'', > > onFailure: function(transport) > > { > > $("update_message").update(transport.statusText); > > }, > > onSuccess: function(transport) > > { > > new Effect.BlindUp(content, {queue: ''front'', scope: id} ); > > new Element.update(content,transport.responseText, {queue: ''end'', > > scope: id} ); > > new Effect.BlindDown(content, {queue: ''end'', scope: id} ); > > } > > }); > > </code> > > > And it works OK, except that it does the actions in 1-3-2-4 order, > > meaning it gets the editor form, updates the contents of the DIV tag, > > then blinds up, then blinds down. Kind of the wrong effect, but > > otherwise the AJAX functions work fine, the update works fine, and the > > effects work fine, just in the wrong order. > > > My question is, am I unable to put the Prototype update() function in > > a queue? That seems to be the problem. > > -- > View this message in context:http://www.nabble.com/Help-with-effect-queue.-tf3934300.html#a11159113 > Sent from the RubyOnRails Spinoffs mailing list archive at Nabble.com.--~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
Thank you so much. Your solution worked although for SOME reason I couldn''t copy it right at first - kept getting errors. So, I reverted back to my original code, copied it again, had a beer and tried it, and it worked. On Jun 16, 6:38 pm, kangax <kan...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> this should work: > > ... > onSuccess: function(transport) { > new Effect.BlindUp(content, { > afterFinish: function() { > content.update(transport.responseText); > new Effect.BlindDown(content); > }}); > > ... > > > > Shane Lambert wrote: > > > I have an interesting challenge for you. I am using both Scriptaculous > > and Prototype on a web site (not using Ruby) and I am trying to queue > > effects and updates. Here is the situation - I have a page with > > editable blocks, when the user clicks on the edit button under the > > box, I want it to: > > > 1) Use Ajax to go out and get the code to build the editor form. > > 2) When it has the form, use Effect.BlindUp to hide the div object. > > 3) Use Element.Update to change the contents of the div object. > > 4) Finally, use Effect.BlindDown to show the updated div object. > > > So, I have this - and please assume that variables used in the code > > snippet below are defined in non-quoted parts of this code: > > > <code> > > new Ajax.Request(url, { > > method: ''get'', > > onFailure: function(transport) > > { > > $("update_message").update(transport.statusText); > > }, > > onSuccess: function(transport) > > { > > new Effect.BlindUp(content, {queue: ''front'', scope: id} ); > > new Element.update(content,transport.responseText, {queue: ''end'', > > scope: id} ); > > new Effect.BlindDown(content, {queue: ''end'', scope: id} ); > > } > > }); > > </code> > > > And it works OK, except that it does the actions in 1-3-2-4 order, > > meaning it gets the editor form, updates the contents of the DIV tag, > > then blinds up, then blinds down. Kind of the wrong effect, but > > otherwise the AJAX functions work fine, the update works fine, and the > > effects work fine, just in the wrong order. > > > My question is, am I unable to put the Prototype update() function in > > a queue? That seems to be the problem. > > -- > View this message in context:http://www.nabble.com/Help-with-effect-queue.-tf3934300.html#a11159113 > Sent from the RubyOnRails Spinoffs mailing list archive at Nabble.com.--~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---