johntanslade-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org
2006-Oct-21 15:23 UTC
Scriptaculous Slide Effect
Hi guys, I just started on AJAX and Scriptaculous/Prototype is looking great. I have a problem integrating PHP with it.I generate this HTML page based $query. It display a list of items: its name and its description (currently using a placeholder for description). Each item uses Effect.toggle(slide) to slide the description in and out of the page when a user click on the item name. How do I make the descriptions "hide" the first time I run the page? i.e. don''t show the <div> section at the start, only show it when a user click on an Item Name. Thanks for your help. P/S: I am developing a Trading Card Game with Flash/AJAX/PHP with a team. The following is my code snippet: ------------------------------------------------------- <?php echo "<ul>\n"; foreach ($query->result() as $card) { $a_out = sprintf("<li><a href =''#'' onClick=\"Effect.toggle(''card-view-slide_%s'', ''slide''); return false\">%s</a></li>\n", $card->idCard, $card->cardName); $div_out = sprintf("<div id=\"card-view-slide_%s\"><div>Description/Stats of %s</div></div>", $card->idCard, $card->cardName); echo $a_out; echo $div_out; } echo "</ul>\n"; ?> --~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
Hello John. The following code should do what you want. Note the *style="display:none;"* added to the description div. This hides the div in the beginning I tidied up the PHP a bit, I hope you don''t mind. Using the alternative, foreach(...): ... endforeach; syntax, saves a lot of echoing and sprintf''s and just makes things look better and easier to maintain. Also <?=$someVariable?> is short for <?php echo($someVariable); ?> <ul> <?php foreach ($query->result() as $card): ?> <li> <a href ="#" onClick="Effect.toggle(''card-view-slide_<?=$card->idCard?>'', ''slide''); return false;"> <?=$card->cardName?> </a> </li> <div id="card-view-slide_<?=$card->idCard?>" style="display:none;"><div> Description/Stats of <?=$card->cardName?> </div></div> <?php endforeach; ?> </ul> - Brian Peiris On 10/21/06, johntanslade-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org <johntanslade-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> > Hi guys, > > I just started on AJAX and Scriptaculous/Prototype is looking great. > > I have a problem integrating PHP with it.I generate this HTML page > based $query. It display a list of items: its name and its description > (currently using a placeholder for description). > > Each item uses Effect.toggle(slide) to slide the description in and out > of the page when a user click on the item name. > > How do I make the descriptions "hide" the first time I run the page? > i.e. don''t show the <div> section at the start, only show it when a > user click on an Item Name. > > Thanks for your help. > > P/S: I am developing a Trading Card Game with Flash/AJAX/PHP with a > team. > > The following is my code snippet: > ------------------------------------------------------- > <?php > echo "<ul>\n"; > foreach ($query->result() as $card) { > $a_out = sprintf("<li><a href =''#'' > onClick=\"Effect.toggle(''card-view-slide_%s'', > ''slide''); return false\">%s</a></li>\n", > $card->idCard, $card->cardName); > > $div_out = sprintf("<div > id=\"card-view-slide_%s\"><div>Description/Stats of %s</div></div>", > $card->idCard, $card->cardName); > > echo $a_out; > echo $div_out; > } > echo "</ul>\n"; > ?> > > > > >-- ===========================Brian Peiris Waterloo, Ontario, Canada brianpeiris-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org mbmpeiris-QFUY5ocGksJFJ04o6PK0Fg@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 -~----------~----~----~----~------~----~------~--~---
johntanslade-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org
2006-Oct-21 17:51 UTC
Re: Scriptaculous Slide Effect
Great. I will try it out. Thank you for the correction. I am new to web development. On Oct 22, 12:05 am, "Brian Peiris" <brianpei...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> Hello John. > The following code should do what you want. > Note the *style="display:none;"* added to the description div. This > hides the div in the beginning > I tidied up the PHP a bit, I hope you don''t mind. > Using the alternative, foreach(...): ... endforeach; syntax, saves a > lot of echoing and sprintf''s and just makes things look better and > easier to maintain. Also <?=$someVariable?> is short for <?php > echo($someVariable); ?> > > <ul> > <?php foreach ($query->result() as $card): ?> > <li> > <a > href ="#" > onClick="Effect.toggle(''card-view-slide_<?=$card->idCard?>'', > ''slide''); return false;"> > <?=$card->cardName?> > </a> > </li> > <div > id="card-view-slide_<?=$card->idCard?>" > style="display:none;"><div> > Description/Stats of <?=$card->cardName?> > </div></div> > <?php endforeach; ?> > </ul> > > - Brian Peiris > > On 10/21/06, johntansl...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org <johntansl...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > > > > > > Hi guys, > > > I just started on AJAX and Scriptaculous/Prototype is looking great. > > > I have a problem integrating PHP with it.I generate this HTML page > > based $query. It display a list of items: its name and its description > > (currently using a placeholder for description). > > > Each item uses Effect.toggle(slide) to slide the description in and out > > of the page when a user click on the item name. > > > How do I make the descriptions "hide" the first time I run the page? > > i.e. don''t show the <div> section at the start, only show it when a > > user click on an Item Name. > > > Thanks for your help. > > > P/S: I am developing a Trading Card Game with Flash/AJAX/PHP with a > > team. > > > The following is my code snippet: > > ------------------------------------------------------- > > <?php > > echo "<ul>\n"; > > foreach ($query->result() as $card) { > > $a_out = sprintf("<li><a href =''#'' > > onClick=\"Effect.toggle(''card-view-slide_%s'', > > ''slide''); return false\">%s</a></li>\n", > > $card->idCard, $card->cardName); > > > $div_out = sprintf("<div > > id=\"card-view-slide_%s\"><div>Description/Stats of %s</div></div>", > > $card->idCard, $card->cardName); > > > echo $a_out; > > echo $div_out; > > } > > echo "</ul>\n"; > > ?>-- > ===========================> Brian Peiris > Waterloo, Ontario, Canada > brianpei...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org > mbmpei...-QFUY5ocGksJFJ04o6PK0Fg@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 -~----------~----~----~----~------~----~------~--~---