Solved

JavaScript error in ie

Posted on 2010-09-23
11
414 Views
Last Modified: 2013-11-08
Hello all I'm receiving an error in IE for a JavaScript function that calls a modal. Any help would be great I will attach the error and code below. Thanks

IE Webpage error details

Message: 'this._curView' is null or not an object

// JavaScript Document

FRA.ModalHandler = {

    views:[],

	_currentArgs:{},

    _isvisible: false,

    _curView:null,

	init:function() {

        var self = this;

        for (var skin in FRA.Skins.Modal) {

            this.views[skin] = new FRA.ModalView(FRA.Skins.Modal[skin],skin);

            this.views[skin].onClose = function() {

                self.hide();

            };

        }        

        this.bind();

	},

    show:function(args) {

	

        this._isvisible = true;

        this._curView = typeof args.skin === 'undefined'?this.views['default']:this.views[args.skin];

        this._curView.show(args);

	},

    hide:function(e) {

         this._isvisible = false;

         this._curView.hide();  

	},

    _click: function(base) {

		var args = FRA.Parser.parse(base.className,'modal',{

            width:200,

            height:200,

            skin:'default',

            base:base,

            content:'<p>Tooltip content undefined</p>'

        });

        args.content = '#'+args.content;

		FRA.ModalHandler.show(args);

    },



    bind:function() {

        var self = this;

        var launchers = document.getElementsByTagName('a');

        for (var i=0,len=launchers.length;i<len;i++) {

            if (launchers[i].className.match('modal::')) {

                launchers[i].onclick = function() {

                    self._click(this);

                };

            }

        }

	}

};

Open in new window

0
Comment
Question by:yando18
11 Comments
 
LVL 82

Expert Comment

by:Dave Baldwin
Comment Utility
Huh?  You defined it as 'null' in line 6.  It probably needs to be something else.
0
 

Author Comment

by:yando18
Comment Utility
Any thoughts on what it should be? Thanks
0
 
LVL 82

Expert Comment

by:leakim971
Comment Utility
You confirm it run fine in FF or an other browser ?
Could you post more code or give a link on the page ?
0
 
LVL 82

Expert Comment

by:leakim971
Comment Utility
Line 20 : if args.skin in not defined we set the _curview with the default view : this.views['default']

but currently, line 3, you don't define a 'default' view :
views:[]
0
 

Author Comment

by:yando18
Comment Utility
default view is defined in another part of the doc
0
Highfive + Dolby Voice = No More Audio Complaints!

Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

 
LVL 14

Expert Comment

by:ddsh79
Comment Utility
to me it is not line 6 which is causing error. that is just the definition.
It should be line 20 and 21
somehow in line 20 _currView is not getting initialized and the second line must be throwing error
below is not getting initialized
this._curView = typeof args.skin === 'undefined'?this.views['default']:this.views[args.skin];

below is causing error due to above
this._curView.show(args);
0
 
LVL 82

Expert Comment

by:leakim971
Comment Utility
>default view is defined in another part of the doc

Yes, of the doc not in your code. Could you give us a link for this doc ?
You need to create somewhere or initialy populate, line 3, the views array
0
 

Author Comment

by:yando18
Comment Utility
See attached.
// JavaScript Document

FRA.Skins = {

    Modal: {

        'default':'<div class="modal hidden"><div class="pad"><a class="close" href="javascript:void(0);"><img alt="" src="../i/modal/close.jpg" /></a><div class="modal_content"></div></div></div>',

        'empty':'<div class="modal hidden"><div class="modal_content" id="mc"></div></div>',

		'video':'<div class="video_overlay" id="video_overlay"><div class="video_wrapper" id="video_wrapper"><div class="video_player" id="video_player"><div style="background-color: #fff; padding: 20px"><center>In order to watch the video, you will need the latest flash player.<br><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /><br> <a href="javascript:FRA.ModalHandler.hide();" class="close">Close this screen</a></center></div></div></div></div>'

    },

    Tooltip: {

         'DEFAULT':'<div class="tooltip hidden"><div class="tooltip_border"><div class="tooltip_content"></div></div><div class="tooltip_carat"></div></div>'

    },

    Video : {

        'DEFAULT':'<div class="video_overlay" id="video_overlay"><div class="video_wrapper" id="video_wrapper"><div class="video_player" id="video_player"><div style="height:508px;background-color:#fff;padding:120px;text-align:center;"><h1 style="margin-bottom:50px;">In order to watch this video, you must update your version of<br />Adobe Flash Player.</h1><a href="http://www.adobe.com/go/getflashplayer" target="_blank"><img src="http://www.adobe.com/images/shared/download_buttons/get_adobe_flash_player.png" class="centered" alt="Get Adobe Flash player" /></a><div class="fixer" style="height:50px;"></div><a href="javascript:FRA.ModalHandler.hide();">Close this screen</a></div></div></div></div>'

    }

};



FRA.ModalView = function(el,type) {

    var self = this;

    this._el = el;

    this._type = type;

    this._contentDiv = FRA.$$(this._el,'div','modal_content')[0];

};



FRA.ModalView.prototype = {

     _el: null,

     _contentDiv:null,

     _nodes:[],

     _curContent:null,

     _useIHTML:false,

     _type:'default',

    show:function(args) {

	

        var self = this;

        if (args.type === 'iframe') {

            this._curContent = document.createElement('IFRAME');

            var w = args.width,

                h = args.height;

            if (this._type === 'default') {

                w = w-45;

                h = h-95;

            }

            this._curContent.style.width = w + 'px';

            this._curContent.style.height = h + 'px';

            this._curContent.style.border = 'none';

            this._useIHTML = true;

        } else if (this._type=== 'video') {

			 this._curContent = "<div id='video_content'></div>";

		}else {

            this._curContent = /^#/.test(args.content) ? 

                document.getElementById(args.content.replace('#','')) : 

                (function() {

                    self._useIHTML = true;

                    return args.content;

                })();      

        }

        

        FRA.OVERLAY.showOverlay();

        var st = document.body.scrollTop;

		if(st == 0) {

			var st = document.documentElement.scrollTop;

		}

        

        if (!this._useIHTML) {

            var cn = this._curContent.childNodes;

            for (var i=0,len=cn.length;i<len;i++) {

                if (cn[i].nodeType === 1) {

                    this._nodes.push(cn[i]);    

                }

            }

            for (var i=0,len=this._nodes.length;i<len;i++) {

                this._contentDiv.appendChild(this._nodes[i]);

            }

        } else if (args.type === 'iframe') {

            this._contentDiv.appendChild(this._curContent);

            this._curContent.setAttribute('src',args.content);

        } else {

            this._contentDiv.innerHTML = this._curContent;

        }

        

        this._contentDiv.style.opacity = 1;

        this._contentDiv.style.filter = 'alpha(opacity=100)';

        

        

        var x = 0, y = 0;

    	if (window.innerHeight) {

    		x = window.innerWidth;

    		y = window.innerHeight;

    	} else if (document.documentElement && document.documentElement.clientHeight) {

    		x = document.documentElement.clientWidth;

    		y = document.documentElement.clientHeight;

    	} else if (document.body) {

    		x = document.body.clientWidth;

    		y = document.body.clientHeight;

    	}        

        var wsize = {

            x: x,

            y: y

        };

        

        

        var top = st + (( wsize.y - args.height) / 2);

        var left = (wsize.x - args.width ) / 2;

        

        this._el.style.width = args.width+'px';

        this._el.style.height = args.height+'px';

        this._el.style.top = top+'px';

        this._el.style.left = left+'px';

        this._el.className = this._el.className.replace('hidden','');

        this._el.style.opacity = 1;

        this._el.style.filter = 'alpha(opacity=100)';

        

        this._bindclose();



    },

    _bindclose: function(){

        var close_buttons = FRA.$$(this._el,'*','close');

        var self = this;

        for(i=0; i<close_buttons.length;i++) {

            (function(index) {

                close_buttons[index].onclick = function() {

                  self.onClose();

                  return false;  

                };    

            })(i);            

        }

    },

    onClose:function() {},

    hide: function(){

        var height = this._el.style.height;

        var width = this._el.style.width;

        this._el.className = this._el.className+' hidden';

        this._el.style.top = '';

        this._el.style.left = '';

        this._el.style.width = '';

        this._el.style.height = '';

        this._el.style.opacity = 0;

        this._el.style.filter = 'alpha(opacity=0)';

        FRA.OVERLAY.hideOverlay();

        if (!this._useIHTML) {

            for (var i=0,len=this._nodes.length;i<len;i++) {

                this._curContent.appendChild(this._nodes[i]);

            }    

        }

        this._contentDiv.innerHTML = '';

        this._curContent = null;

        this._nodes = [];

        this._useIHTML = false;       

    },

    get:function() {

        return this._el;

    }

};



FRA.ModalHandler = {

    views:[],

	_currentArgs:{},

    _isvisible: false,

    _curView:null,

	init:function() {

        var self = this;

        for (var skin in FRA.Skins.Modal) {

            this.views[skin] = new FRA.ModalView(FRA.Skins.Modal[skin],skin);

            this.views[skin].onClose = function() {

                self.hide();

            };

        }        

        this.bind();

	},

    show:function(args) {

	

        this._isvisible = true;

        this._curView = typeof args.skin === 'undefined'?this.views['default']:this.views[args.skin];

        this._curView.show(args);

	},

    hide:function(e) {

         this._isvisible = false;

         this._curView.hide();  

	},

    _click: function(base) {

		var args = FRA.Parser.parse(base.className,'modal',{

            width:200,

            height:200,

            skin:'default',

            base:base,

            content:'<p>Tooltip content undefined</p>'

        });

        args.content = '#'+args.content;

		FRA.ModalHandler.show(args);

    },



    bind:function() {

        var self = this;

        var launchers = document.getElementsByTagName('a');

        for (var i=0,len=launchers.length;i<len;i++) {

            if (launchers[i].className.match('modal::')) {

                launchers[i].onclick = function() {

                    self._click(this);

                };

            }

        }

	}

};

Open in new window

0
 
LVL 82

Expert Comment

by:leakim971
Comment Utility
Do you show it by passing an argument ?
0
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
Comment Utility
Replace the line 171 by the following :

can you confirm the alert you get ?
if(typeof args.skin === 'undefined') {
    this._curView = this.views['default'];
    alert("using default : " +  this._curView);
}
else {
    this._curView = this.views[args.skin];
    alert("using skin : " +  this._curView);
}

Open in new window

0
 
LVL 82

Expert Comment

by:leakim971
Comment Utility
Thanks for the points!
0

Featured Post

Highfive + Dolby Voice = No More Audio Complaints!

Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

Join & Write a Comment

Today I would like to talk about localizing (Internationalization) JavaScript applications. Introduction When creating an application that is going to be used by many people around the globe, it is important to remember that not everyone speak…
This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

762 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

9 Experts available now in Live!

Get 1:1 Help Now