Hey folks,
I think I got something for ya!
My newest projects had some quite huge forms with multiple inputs/
elements that needed to be hidden/disabled depending on values of
other inputs.
I did not want to add custom js to each onChange element whose value
might influence the visibility/status of another element. Therefore I
came up with a class that handles these dependecies quite easily:
Layr.
All you need to do is include the .js file and add something like this
to your website:
Event.observe(window, 'load',function(){ list.add('controllerInput',
'3', '!=', 'test', 'hidden'); }, false);
This provokes the following: If the change event of the element with
the id 'controllerInput' is invoked, it will be checked wether its
value equals 3 or not. If it does not equal 3, the element with the id
'test' will be hidden. If the condition is no longer met, the element
with the id 'test' will be reset to being visible and enabled, every
additional class that was added by Layr will be removed if the
condition that added the class is no longer met.
You can get the class from GitHub, I added a gist with the source
code: https://gist.github.com/91300492f82f2f399001
A simple example can be viewed here: http://davidbehler.de/projects/layr/
Try entering the numbers 1, 2 or 3 in the first input.
Please tell me if there is anything similar out there...I don't want
to reinvent the wheel ;)
I hope there is someone except me out there that might find this
handy.
Feel free to post comments and critics ... I really wanna know what
you think of this.
P.S.: This is my first post in this group, so please be gentle ;)
Thanks,
David
--~--~---------~--~----~------------~-------~--~----~
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
-~----------~----~----~----~------~----~------~--~---
