Mootools 'Uncaught TypeError: Property 'container' of object #<Object> is not a function' error when accordion added

StackOverflow https://stackoverflow.com/questions/17339413

Question

I'm working with a site developed by an external developer. I've noticed the code they use for accordions only supports a fixed number of accordion items per page (even though their CMS can create an unlimited amount of items marked as being displayed accordion-style). I'm trying to tidy this up to avoid confusing my colleagues later down the line.

I'm trying to add a standard Mootools more accordion, but when I add it to a page I get the error below:

Uncaught TypeError: Property 'container' of object # is not a function mootools-core-1.4.5-full-compat.js:683

Here's an example page - the links in tags below 'Session details - Click the titles below for more information on each session.' should all be accordions.

I'm calling this code at the bottom of my page from http://www.aua.ac.uk/scripts/accordion.js:

window.addEvent('domready', function(){
    new Fx.Accordion($$('#sub_left .accordion_heading'),$$('#sub_left .accordion_holder'), {
        opacity: 0,
        display: -1,
        alwaysHide: true
    });
});

Using these versions of Mootools (referenced at the top of the page in the head):

mootools-core-1.4.5-full-compat.js and mootools-more-1.4.0.1.js

Here is a fiddle using those verions of mootools, a portion of the HTML from my page, and the same accordion code - and it's all working. I think there is a conflict somewhere on my full page but I can't work out where.

http://jsfiddle.net/bcfu2/5/

Does anyone have any idea how to either fix this, or where to start debugging it - other than removing code/links to JS files one by one?

Was it helpful?

Solution

The js of microsoft creating some collision with mootools Array implements:

 <script src="/WebResource.axd?d=maKRZUGfDX1oNLvbjE5CVpp8Freqy1QYQvNjdATWoN2tEAP8BRYB9DDy6RYI9PQwhPak11VYG6N-fakPxQX9OdjCS0k1&amp;t=634604425351482412" type="text/javascript"></script>

<script src="/ScriptResource.axd?d=WSd7pLxkPBvO2m8zwahAn--zWk9drBpRcPo6hiP5S6h3lc4U02xAjGNhWI80hxb4tjqMmAYSYPB7ziM6k7g74E-bBOiz7xRre8hSbGF4tJ2E6c8VeX-W4J-tQv1ZL10ruL5uPffOFyiUX3xZVWWQT_YClyI1&amp;t=ffffffffb868b5f4" type="text/javascript"></script>
<script src="/ScriptResource.axd?d=bawOzJp1LF5Sj6rS_r-W75i2ouoWmFBvTNI9zqR0q_Lsf42KbPAaMTrPFSZ9jqam3zDWOHBUgNgKBDwGos_WSLyBOzTAzYVuGRRlgWxM0Jm-uc_fb8NPaprYxmDuvgVoemZKvN0bfNIpr2yzsXUjhCVB-0dFOF6qHbKXJEXRN_LWShmr0&amp;t=ffffffffb868b5f4" type="text/javascript"></script>

If you remove those scripts you will see your code is working fine:

http://jsfiddle.net/V8WRM/

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top