I stand corrected!
When I took the quotes out, I tested the wrong element.
Effect.toggle(y.element().id+"AddrDIV"); works!!
I thought scriptaculous overrode the prototype commands. Now I know!
Thanks,
Ken
On Jan 21, 9:49 am, kenxle <kenstcl...@gmail.com> wrote:
> ID in quotes:
> Embarrassing mistake to be sure, but that didn't fix it. Plus, I've
> written and unwritten that statement so many times, I'm sure I did it
> correctly one of the times. :)
>
> Toggle params:
> Scriptaculous has default params. If you don't specify, it chooses
> 'fade' for you. And I've tried it with the effect param too.
>
> DOM structure:
> I usually pay attention to this, but I'll go read the article and see
> if there's something there that helps.
>
> Thanks,
> Ken
>
> On Jan 21, 6:25 am, "T.J. Crowder" <t...@crowdersoftware.com> wrote:
>
> > Hi,
>
> > Caveat: I don't use script.aculo.us, but I run across it a lot because
> > I use Prototype. :-)
>
> > > $(y.element().id+"AddrDIV").toggle('slide'); //toggles correctly,
>
> > but without effect
>
> > That's because Element#toggle is a Prototype thing[1]. I don't think
> > script.aculo.us overwrites it (but I could be wrong).
>
> > > //new Effect.toggle('y.element().id+"AddrDIV"', 'slide'); //doesn't
>
> > work at all
>
> > You've put the ID in quotes, and so the ID it's looking for literally
> > is 'y.element().id+"AddrDIV"'. Without the quotes, it should work
> > (provided the target element exists). I think that Effect.toggle
> > probably wants a parameter, though, to tell it *how* to toggle (slide,
> > etc.). Also, be sure your DOM structure is correct; see the notes on
> > the Effect.toggle documentation page[2].
>
> > [1]http://api.prototypejs.org/dom/element.html#toggle-class_method
> > [2]http://wiki.github.com/madrobby/scriptaculous/effect-toggle
>
> > HTH,
> > --
> > T.J. Crowder
> > Independent Software Consultant
> > tj / crowder software / comwww.crowdersoftware.com
>
> > On Jan 21, 12:11 am, kenxle <kenstcl...@gmail.com> wrote:
>
> > > Hi, I've been beating my head over this issue for the last two days,
> > > so I appreciate in advance any help that is given.
>
> > > I've got Prototype set up in an "unobtrusive" style, which I much
> > > prefer, but I can't seem to get the scriptaculous effects to work.
> > > When I put the scriptaculous calls inline in the HTML, they work
> > > correctly, so I know the files are linked correctly. Here's a code
> > > snippet.
>
> > > <script type="text/javascript" src="./prototype/prototype.js"></
> > > script>
> > > <script type="text/javascript" src="./prototype/scriptaculous.js"></
> > > script>
>
> > > <script type="text/javascript">
> > > document.observe("dom:loaded", function() {
> > > //alert("hello unobtrusive prototype!");
>
> > > // set hrefs to void so they won't reload page. they are <a> instead
> > > of <div> or <span> so it will autochange cursor
> > > $$('.moreInfo').each(function(x){
> > > x.href="javascript:void(0);"
> > > });
>
> > > $$(".dealerAddress").invoke("hide");
>
> > > //onclick, show address
> > > $$('.moreInfo').invoke("observe", "click", function(y){ //y is
> > > the mouseEvent: click
> > > $(y.element().id+"AddrDIV").toggle('slide'); //toggles
> > > correctly,
> > > but without effect
> > > //new Effect.toggle('y.element().id+"AddrDIV"', 'slide');
> > > //doesn't
> > > work at all
> > > });});//close dom:loaded
>
> > > </script>
>
> > > <a id="4Link" class="dealerLink" href="http://www.co.com/"; title="Go
> > > to their store">a removed name</a>
> > > <a id="4" class="moreInfo" href="" title="Expand address info">[info]</
> > > a><br />
> > > <div id="4AddrDIV" class="dealerAddress">
> > > removed info, all simple plaintext
> > > </div>
>
> > > <a id="5Link" class="dealerLink" href="http://www.co.com/"; title="Go
> > > to their store">another removed name</a>
> > > <a id="5" class="moreInfo" href="" title="Expand address info">[info]</
> > > a><br />
>
> > > <div id="5AddrDIV" class="dealerAddress">
> > > more plaintext
> > > </div>
>
> > > Quick overview of the functionality:
> > > When user clicks [info], it grabs that elements id, then appends
> > > "AddrDIV" to access to related address div. All the divs are set up
> > > with proper associated id names, and there is a name in front of the
> > > number that I have removed.
>
> > > Like I said, I tested a single element with an inline call, and it
> > > worked, but I really would like to keep this unobtrusive. I'm 2 days
> > > into learning Prototype/Scriptaculous, and am moving over from jQuery
> > > (if you couldn't tell by the code style :) ).
>
> > > Any help would be appreciated. Thanks!
--
You received this message because you are subscribed to the Google Groups
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptacul...@googlegroups.com.
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en.
