Thanks for the fast response and information. I didn't understand how
prototype, jquery, mootools, and dojo were extending javascript
differently, I get it a little better now. Since I have both jquery
and prototype used in my project, i was able to accomplish my task
with the following code so that they play nicely together:
script type=text/javascript
$(document).ready(function(){
$j= jQuery.noConflict();
$j('.bio_button').click(function(event) {
$j('.bio').hide();
var element = Event.element(event);
var id = element.id.substring(0,element.id.length-1);
var idt = document.getElementById(id)
$j(idt).show();
});
});
/script
Thanks for your help ! It would have taken me forever to figure it
out without it. It would be cool if there were a language translator
between these javascript extensions.
-Nelson
On Aug 31, 3:22 am, T.J. Crowder t...@crowdersoftware.com wrote:
Hi,
$(document).ready(function(){
$(.bio_button).click(function(event) { //when a user clicks on
Both of those look like jQuery, not Prototype. Prototype's equivalent
of the jQuery ready function is the dom:loaded event[1]:
document.observe('dom:loaded', yourCallbackGoesHere);
Similarly, $()[2] looks up elements by ID, it does not search for them
by selector. $$()[3] does that.
It may be worth your taking a step back and reading the Prototype API
[4] through from beginning to end. It takes about an hour, and will
save you at least that much time across the life of your project
(heck, probably even in the coming week).
[1]http://prototypejs.org/api/document/observe
[2]http://prototypejs.org/api/utility/dollar
[3]http://prototypejs.org/api/utility/dollar-dollar
[4]http://prototypejs.org/api
HTH,
--
T.J. Crowder
tj / crowder software / comwww.crowdersoftware.com
On Aug 31, 1:48 am, Nelson Hernandez nels...@gmail.com wrote:
I have a very simple script that is intended to show an employees
biography on click, and hide all other biography's (since they occupy
the same space). I have two issues I can't resolve, and for the life
of me can't figure out why. I'm using Ruby on Rails and I have
included the default javascrip which includes Prototype. I'm testing
in FireFox.
Here's the code with comments for reference, exact problems detailed
below:
script type=text/javascript
$(document).ready(function(){
$(.bio_button).click(function(event) { //when a user clicks on
div with class bio_button, do:
$(.bio).hide(); //hide all divs that
have a
class of bio
var element = Event.element(event); //get the div id for
the
element clicked
var id = element.id.substring(0,element.id.length-1);
//remove the
last letter of that div id, which
//
corresponds to the div which contains the
//
biography text
//alert(id); //used to make sure the
substring was
working, it is.
$(id).show(); //this doesn't work for some reason
HELP,
please :(
});});
/script
...
div class=bio_button id=timBclick to show Tims bio/div
div class=bio_button id=bethBclick to show Beths bio/div
...
div class=bio id=tim style=display:none;tim's awesome
biography/div
div class=bio id=beth style=display:none;beth's awesome
biography/div
PROBLEM(s) (using a click on tim as example):
1) The above does indeed hide all bio's, and will output an alert of
tim if I click on tim. However, it won't change the display style
to show.
2) In the javascript, if I replace $(id).show(); with $(tim).show();
it still doesn't workunless I use tim as one of the class
definitions in the html instead of a div id. If I specify tim as a
class, and use tim explicitly in the javascript, it works perfectly.
Sorry if this is the wrong forum, i'm losing my mind over what seems
should be very simple. Thanks to anyone that can help.
-Nelson
--~--~-~--~~~---~--~~
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-scriptaculous@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
-~--~~~~--~~--~--~---
