Hey gang -
First day monkeying with Prototype. So far, so good - mostly...
Here''s my quandary. I have three select elements - the
second''s
contents are dependent upon the first''s selected value; the
third''s
contents on the second''s. I have the second/third select elements
wrapped with div tags.
I''ve got an update function working fine, firing when the first select
changes, that will plink a URL, said script returns revised HTML for
the next select''s div area. Using "success:
''divID''", the second
select''s HTML is replaced with the newly passed-through HTML, with my
chosen item within that select properly showing as the selected item.
All well and good.
I''ve got another update function working fine, firing when the second
select changes, that works the same way as above, updating the third
select''s div area, yadda yadda.
These two functions work great by themselves. My issue is trying to
chain them - i.e. when I choose an item from the first select, the
second select gets updated - then the third select is updated based on
the value of the newly-updated second select. The problem here is, the
second update fires off without taking into account the new second-
select value. It''s like it''s firing off before the second
div''s area
is really populated properly.
A bit of pseudo-code for you:
function chooseFirst() {
(ajax code that updates second div, works great)
chooseSecond();
}
function chooseSecond() {
(ajax code that updates third div, works great)
}
What''s happening when changing the first select value, hence firing
off chooseFirst(), is that it runs, the second select''s contents
update - and then chooseSecond() is firing off, but using the value of
the second select that was there BEFORE all this started.
I''m trying to figure out the best way to properly chain these updates
together so that the first one is fully completed before the second
one begins.
Any pointers in the right direction would be great. Keep in mind, this
is my first day dealing with Prototype so go easy on me. :P
--Scott
--~--~---------~--~----~------------~-------~--~----~
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
-~----------~----~----~----~------~----~------~--~---
Your best bet might be to chain the call to chooseSecond() from within the onComplete handler of the Ajax.Updater that''s updating the div with the first select in it. The onComplete handler of the Ajax.Updater object fires after the element has been updated so it should guarantee that the new data are present before you try and work with them. -- Dash -- ScottW wrote:> Hey gang - > > First day monkeying with Prototype. So far, so good - mostly... > > Here''s my quandary. I have three select elements - the second''s > contents are dependent upon the first''s selected value; the third''s > contents on the second''s. I have the second/third select elements > wrapped with div tags. > > I''ve got an update function working fine, firing when the first select > changes, that will plink a URL, said script returns revised HTML for > the next select''s div area. Using "success: ''divID''", the second > select''s HTML is replaced with the newly passed-through HTML, with my > chosen item within that select properly showing as the selected item. > All well and good. > > I''ve got another update function working fine, firing when the second > select changes, that works the same way as above, updating the third > select''s div area, yadda yadda. > > These two functions work great by themselves. My issue is trying to > chain them - i.e. when I choose an item from the first select, the > second select gets updated - then the third select is updated based on > the value of the newly-updated second select. The problem here is, the > second update fires off without taking into account the new second- > select value. It''s like it''s firing off before the second div''s area > is really populated properly. > > A bit of pseudo-code for you: > function chooseFirst() { > (ajax code that updates second div, works great) > chooseSecond(); > } > > function chooseSecond() { > (ajax code that updates third div, works great) > } > > What''s happening when changing the first select value, hence firing > off chooseFirst(), is that it runs, the second select''s contents > update - and then chooseSecond() is firing off, but using the value of > the second select that was there BEFORE all this started. > > I''m trying to figure out the best way to properly chain these updates > together so that the first one is fully completed before the second > one begins. > > Any pointers in the right direction would be great. Keep in mind, this > is my first day dealing with Prototype so go easy on me. :P > > --Scott > > > > > >--~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
Woot - that did the trick. I had tried the onComplete bit before, but it was a matter of finding the right combination between calling ''updater'' and ''request'', using the proper ''success: pointer, and the onComplete bit in there as well. Before I''d have two out of the three set in various combinations. Thanks much David! --~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
Hey Scott,
I imagine you bound event listeners to your selects early. It makes no
sense, as you''re going to REPLACE the DOM element for the 2nd and,
later, 3rd selects, so the NEW nodes won''t have event listeners
attached
then.
OTOH, replacing the ORIGINAL selectboxes MAY very well trigger their
change event (which I assume you''re listening to). BTW, if you use a
general ''change'' listener at a higher level, using
Event.element to see
which select fired it, this issue could arise as well.
The clean way would be this: when about to fire the A.U call to replace
an existing <div>''s content, i.e. its wrapped <select>, do
this:
1) unregister the to-be-updated <select>''s observer(s). This
means
that, yes, you kept a reference to the function (if you bound it,
you took care to reference the bound version, not the original one,
btw.)
2) disable it, for good measure.
3) Do your A.U., but bind its onComplete to a function doing 4)
4) If successful, rebind your change listener to the new method.
Another approach would be to return XHTML with a final, inline <script>
that does the binding, and firing A.U. with the evalScripts: true
option. Works well, but requires that your script has access to the
listener functions already.
''HTH
--
Christophe Porteneuve a.k.a. TDD
"[They] did not know it was impossible, so they did it." --Mark Twain
Email: tdd-x+CfDp/qHev2eFz/2MeuCQ@public.gmane.org
--~--~---------~--~----~------------~-------~--~----~
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
-~----------~----~----~----~------~----~------~--~---
Ok, hitting another similar snag with another part of my project.
Again, I''ve got three divs, each containing a select element - change
the first, the second should change, then the third should change
based on the current selected value of the second (which at this point
should be the first item).
Using the same code as the bit from above - almost - it''s not quite
working. Same issue - the second div''s not quite updating before the
onComplete is calling the next function (which grabs the second div''s
select''s value).
The difference here is that in this case, I''ve got a few groups of
these three selects, each to operate independently of each other.
Instead of just "chooseFirst()" in the first select, I''ve got
"chooseFirst(''divgroup'')", divgroup being the common
string in all the
group''s id tags. That bit works great for the most part - but in the
chooseFirst() function itself, when it comes to the onComplete, I have
to pass that ''divgroup'' value onto the chooseSecond()
function, which
I''m doing a la
onComplete: chooseSecond(divgroup)
An alert in chooseSecond spitting out the divgroup var works fine -
it''s returning the value expected. But - the div to be updated in the
first function isn''t fully updated by the time the second function is
getting called, onComplete or no. So what''s happening is, if
it''s the
first time going through the process, the second function errors as
it''s not finding any values in the second select to use to update the
third select. After this, changing the first select updates the second
select, and the third select gets updated but based on the second
select''s value BEFORE it gets updated - i.e. it''s basically
one
generation of data behind.
The chooseSecond() function, when called directly (by changing the
second select''s value) is updating the third div/select contents just
fine.
--~--~---------~--~----~------------~-------~--~----~
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
-~----------~----~----~----~------~----~------~--~---
Well, figured out a workaround. It''s probably not the best way to do it, but it''s working. Trouble was the onComplete in the first function was trying to pass a value on, i.e. onComplete: chooseSecond(divgroup) So in those cases, it was passing an object on instead of the actual string value of ''divgroup''. This was futzing with things. I''ve since ditched the variable passing part of the onComplete; and earlier in the first function, I just set a JS var with the value of ''divgroup''. In the second function, I check to see if that var has content - and replace the incoming ''divgroup'' var (when called from the first function, contains an object) with the temp var, and zero out the temp var. Then everything updates fine. And as I''m zeroing out the temp var, when triggering the second function from the second select via onChange, it''s passing in the correct value to start with, and the ''is there anything in the temp var?'' check skips right on past. --~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---