Forums

Hey guys,

Creating a form (early stages) that has some dynamic dropdowns. When a user selects something it either shows or hides another container.

You can view it here: http://jsfiddle.net/e9XvP/180/

I have placed that JS in the onLoad event of the form, but for some reason it's not working properly.

Any ideas?
On JSFiddle it works great; exactly how I want.
When I put it into my site (Joomla 3.0 - Chronoforms V4), it fails to run - it never gets past the first 4 lines which hide the appropriate parts of the form to begin with.

Thoughts?

Got it fixed by utilizing THIS FIX FOR THE JAVASCRIPT

Here is a breakdown for those who don't want to visit the link:

Your page is loading mootools once, jQuery twice and jQuery UI twice. Because both jQuery and mootools define a function named '$', this gives you conflicts.

You can fix this by using a self executing closure that maps the non-conflicted version of '$' to a local '$' variable you can actually use.

(function($) {
// your code
})(document.id);

More information on MooTools' "Dollar Safe Mode" can be found here.

Once I surrounded my code with that function - everything worked without issue!