CODEWITHSUNDEEP
jqueryjoomlaundefinedtypeerror
David Nelband
David Nelband

Reputation: 427

Uncaught TypeError: Cannot read property 'nodeName' of undefined

this problem appears only in joomla -

im trying to use the contentflow plugin with my joomla site

this is the plugin site - http://www.jacksasylum.eu/ContentFlow/

this is my site - http://2-dweb.com/RND/

as you can see it doesnt work - it just stays on the loading phase forever

upon closer inspection i can see that there is a problem with this code:

  if (this.content.nodeName == "IMG") {
    CFobj._imagesToLoad++;

    var foobar = function () { 
        CFobj._imagesToLoad--;
        this.image = this.content;
        this.setImageFormat(this.image);
        if ( CFobj.conf.reflectionHeight > 0) {
            this.addReflection();
        }
        this.initClick();
        CFobj._addItemCueProcess(true);
    }.bind(this);

    if (this.content.complete && this.content.width > 0)
        window.setTimeout(foobar, 100);
    else if (this.Browser.IE && !this.content.onload) {
        var self = this;
        var t = window.setInterval( function () {
            if (self.content.complete && self.content.width > 0) {
                window.clearInterval(t);
                foobar();
            }
        }, 10);
    }
    else
        this.content.onload = window.setTimeout(foobar, 100);
}
else {
    this.initClick();
    CFobj._addItemCueProcess(true);
}

};

with the first line - it says "Uncaught TypeError: Cannot read property 'nodeName' of undefined "

but this thing works on my desktop html file and on the plugin site it self!

why doesnt it work on my joomla site? its not a conflict thing - im using no-conflict and i have other jquery plugins that work

update:

rob w helped me with this error: "Change the first line to if (this.content && this.content.nodeName == "IMG") {. That solves the problem"

and it did, but now another error appears:

  initClick: function () {
        var cItem = this.clickItem;
        this[this._activeElement].addEvent('click', cItem, false);
    },

the error - Uncaught TypeError: Cannot call method 'addEvent' of undefined

Upvotes: 18

Views: 80604

Answers (7)

Bartrand
Bartrand

Reputation: 1

You can use event.preventDefault(); inside your function called on specified event. Thanks to this You can prevent loading some default JQuery code which cause an error.

Upvotes: 0

Group of Stars
Group of Stars

Reputation: 36

I fixed with colspan.

<tfoot>
   <tr class="fw-bolder fs-6">
       <th colspan="6" class="text-nowrap align-end">Total:</th>
       <th colspan="3"  class="text-danger fs-3"></th>
   </tr>
</tfoot>

total columns 9, good luck.

Upvotes: 0

Marcos Barreto
Marcos Barreto

Reputation: 1

was with this error. I made the correction leaving all the js and css of the bootstrap with the same version. In my case I used the latest version of each: https://getbootstrap.com/docs/4.4/getting-started/download/

Upvotes: 0

harbrinder_singh
harbrinder_singh

Reputation: 462

Solved this.

I am using bootstrap.css version 3.3.7 and bootstrap.js version 4.0.0.

By changing bootstrap.js to version 3.3.7 my issue got resolved!!!

Upvotes: 3

i89
i89

Reputation: 1112

It is important that you use class="content". The structure should be:

 <div class="ContentFlow" id="cover-menu">
        <div class="flow">
            <div class="item" >
                <div class="content">
                   //your stuff
                </div>
            </div>
        </div>
 </div>

Upvotes: 1

Prasanth K C
Prasanth K C

Reputation: 7332

Load your script only after loading all the elements into DOM.

Your script should be called at the bottom of the page like this

<html>
  <head></head>

  <body>
    <!--HTML Elements here-->

    <script type="text/javascript" src="yourScript.js"></script>
  </body>
</html>

If you are using jquery, you can include the script file anywhere in your page if it is wrapped in document.ready, like this: 

$(document).ready(function(){

  // your code here.. 

});

Upvotes: 1

Techie
Techie

Reputation: 45124

As the error explains "Uncaught TypeError: Cannot read property 'nodeName' of undefined " The element is not available when the script tries to access it. You can solve this in two ways.

  • Try to wrap to code with a document.ready.
  • You can check whether the element is available before accessing it. To get this done use a if clause.

Upvotes: 22

Related Questions