[Last Call] Learn about multicloud storage options and how to improve your company's cloud strategy. Register Now

x
?
Solved

JavaScript error in ie

Posted on 2010-09-23
11
Medium Priority
?
423 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
11 Comments
 
LVL 84

Expert Comment

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

Author Comment

by:yando18
ID: 33746331
Any thoughts on what it should be? Thanks
0
 
LVL 82

Expert Comment

by:leakim971
ID: 33746358
You confirm it run fine in FF or an other browser ?
Could you post more code or give a link on the page ?
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 82

Expert Comment

by:leakim971
ID: 33746438
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
ID: 33746705
default view is defined in another part of the doc
0
 
LVL 14

Expert Comment

by:Dushyant Sharma
ID: 33746709
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
ID: 33746921
>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
ID: 33747081
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
ID: 33748071
Do you show it by passing an argument ?
0
 
LVL 82

Accepted Solution

by:
leakim971 earned 2000 total points
ID: 33748238
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
ID: 33791886
Thanks for the points!
0

Featured Post

Ask an Anonymous Question!

Don't feel intimidated by what you don't know. Ask your question anonymously. It's easy! Learn more and upgrade.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction HTML checkboxes provide the perfect way for a web developer to receive client input when the client's options might be none, one or many.  But the PHP code for processing the checkboxes can be confusing at first.  What if a checkbox is…
This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
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…

650 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