www.webdeveloper.com
Results 1 to 9 of 9

Thread: Wierd behavior of alert box function

  1. #1
    Join Date
    Jun 2007
    Posts
    8

    Wierd behavior of alert box function

    This is wierd behavior in IE 6 (works in FireFox)
    This overrides alert function correctly 'function alert (s,t,icon)' but this
    'window.alert=function(s,t,icon)' does not, the strangest part is that
    ' window.prompt=function(string,defaultValue,fun,funArguments,scope)' does behave correctly and overrides the prompt function.

    The thing that I don't see is why alert function cant be overwritten this same way even that it resides in window scope.

  2. #2
    Join Date
    Feb 2003
    Location
    Michigan, USA
    Posts
    5,773

  3. #3
    Join Date
    Jun 2007
    Posts
    8

    Function Definitions

    Here is complete code :

    Code:
    var alert_w=alert;
    var dialog;
    var buttons=[]
    var confirmationResult=false;
    var confirmEven=new YAHOO.util.CustomEvent("Confirmation Event");
    AlertOveride = function(){
        // return a public interface
        return {
    		//Initalize the component
            init : function(){
    			
            },
            showDialog : function(properties){
                if(!dialog){
                    dialog = new YAHOO.ext.BasicDialog("alert-dlg", {
                            modal:true,
                            autoTabs:false,
    					    autoScroll:true,
    			            resizable:false,
                            width:width,
                            height:height,
                            shadow:true,
    			            draggable:true
    	               });
    
    					buttons["cancel"]=dialog.addButton('Cancel', function(){dialog.hide();confirmEven.fire(false);} , dialog)
    					buttons["ok"]=dialog.addButton('Ok', function(){dialog.hide();confirmEven.fire(true);} , dialog);
    					buttons["close"]=dialog.addButton('Close',  function(){dialog.hide();}  , dialog);
    
    				}// lazy initialize the dialog and only create it once
    
    				if(properties.confirm || properties.prompt){
    					buttons["cancel"].setVisible(true);
    					buttons["ok"].setVisible(true);
    					buttons["close"].setVisible(false);
    				}else{
    	               	buttons["cancel"].setVisible(false);
    					buttons["ok"].setVisible(false);
    					buttons["close"].setVisible(true);
    				}
    
    				var width = 130 + properties.width
    				var height =  90 + properties.height
    				if(width<220)width=220;
    				if(height<90)height=90;
    				dialog.resizeTo(width, height);
    				dialog.show();
            }
        };
    }
    	
    var isConfirm=false;
    var isPrompt=false;
    
    //Overide window.confirm  box
     window.confirm=function(string,fun,funArguments,scope){
    	 this.isConfirm=true;
    	 var response=false;
    	 var ccInterval=0;
    	 if(funArguments==null)funArguments=[];
    		alert(string, 'Confirmation', 'question');
    		confirmEven.subscribe(function(e,arg){
    			if(scope==null)scope=this;
    				funArguments[funArguments.length]=arg;
    				fun.apply(scope,funArguments)
    				confirmEven.unsubscribeAll();
    		});
    		this.isConfirm=false;
     }
    
     window.prompt=function(string,defaultValue,fun,funArguments,scope){
    	 this.isPrompt=true;
    	 var response=false;
    	 document.getElementById('prompt-input-text').value=defaultValue;
    	 if(funArguments==null)funArguments=[];
    		alert(string, 'Prompt', 'question', true);
    		confirmEven.subscribe(function(e,arg){
    			if(scope==null)scope=this;
    			//This simulates the behavior of standard input returning 'null' if the cancel button was pressed
    				var promptValue=document.getElementById('prompt-input-text').value;
    				if(arg[0]==true){//OK Button Pressed
    					funArguments[funArguments.length]=promptValue;
    				}else{//Cancel Button Pressed
    					funArguments[funArguments.length]=null;
    				}
    				fun.apply(scope,funArguments)
    				confirmEven.unsubscribeAll();
    		});
    		this.isPrompt=false;
     }
    
     //overiding default alert box
     /**
     * This is wierd behavior in IE 6   this overides  alert function correctly  'function alert (s,t,icon)'  but this 
     * 'window.alert=function(s,t,icon)'  does not.
     */
    function alert (s,t,icon){
     document.getElementById('prompt-input').style.display='none';
     if(!t || t=='undefined'){
    	t="Alert";
     }
     var eIcon=getEl('alert-icon');
    	eIcon.dom.className='msg-alert-icon';
    	if(icon){
    		switch(icon){
    			case 'alert':eIcon.dom.className='msg-alert-icon'; break;
    			case 'question':eIcon.dom.className='msg-question-icon'; break;
    			case 'info':eIcon.dom.className='msg-info-icon'; break;
    			case 'prompt':eIcon.dom.className='msg-prompt-icon'; break;
    			default:eIcon.dom.className='msg-alert-icon'; break;
    		}
    	}
    	 s=new String(s).replace(new RegExp("\\n", "g"),"<br />");//Preserve \n
    
    	 var bodyData=document.getElementsByTagName('BODY')[0];
    	 //Check for previous instance of the alert-contentDivSize
    	 var d_nested = document.getElementById("alert-contentDivSize");
    	 if(d_nested!=null){
    		 bodyData.removeChild(d_nested);
    	  }
    
    	 var contentDiv=document.createElement('div');
    
    	 contentDiv.style.position='absolute';
    	 contentDiv.style.display='';
    	 contentDiv.id='alert-contentDivSize';
    	 bodyData.appendChild(contentDiv);
    
    	 contentDiv.innerHTML=s;
    	 var region=getEl('alert-contentDivSize').getRegion();
    		 contentDiv.style.display='none';
    	 var height=region.bottom-region.top;
    	 var width=region.right-region.left;
    
    	 if(this.isConfirm){
    		height+=10;
    	 }
    
    	 if(this.isPrompt){
    	 document.getElementById('prompt-input').style.display='';
    	 //Keeping proportions
    		height+=25;
    		width+=25;
    	 }
    
    	var at=getEl('alert-title');
    	var am=getEl('alert-message');
    	at.dom.innerHTML=t;
    	am.dom.innerHTML=s;
    	var alertdialog=new AlertOveride();
    	alertdialog.init();
    	return alertdialog.showDialog({height:height,width:width,confirm:this.isConfirm,prompt:this.isPrompt});
    
     }
    This is puzzling.

  4. #4
    what are u trying to make the alet message do?

  5. #5
    Join Date
    Jun 2007
    Posts
    8

    Desired results

    Here is the result.(See attached file).

    Really what I am concerned with here is the behavior of overriding the alert box
    Thanks.
    Attached Images Attached Images

  6. #6
    Join Date
    Feb 2003
    Location
    Michigan, USA
    Posts
    5,773
    This code worked for me:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
      "http://www.w3.org/TR/html4/strict.dtd">
    
    <html>
    <head>
    <title>Overwrite alert() function</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script type="text/javascript">
    <!-- begin hiding
    window.alert = function() {
      document.getElementsByTagName('body')[0].appendChild(document.createTextNode('AAAH! '));
    };
    
    window.onload = function() {
      alert();
    };
    // end hiding -->
    </script>
    </head>
    <body>
    </body>
    </html>
    One small suggestion -- and I don't know how much it will affect things -- but any time you do foo = function() {}, you should to end it with a semi colon, as you are actually assigning a value to something. similar to var foo = "bar";.

    So it should look like:
    Code:
    window.alert = function() {
      // your code here
    }; // <<--- semi colon
    Since JavaScript recognizes newline characters as the end of a programming line, it shouldn't make a difference. Something else must be going on. What part of the HTML document is this JavaScript being included in? Was there a JavaScript error that perhaps was fixed when you changed the function definition to "function alert()"?

  7. #7
    Join Date
    Jun 2007
    Posts
    8
    thanks for the suggestion toicontien,

    Your code did work on IE and FF as expected.

    Code:
    function alert (s,t,icon){
    }
    
    window.alert=function(s,t,icon){
    };
    This two function declarations should be this same, all I did was change how the function was declared to get it working in IE, so I really don't think that there were any bugs introduced of fixed.

    Thanks for you input.

  8. #8
    Join Date
    Apr 2009
    Posts
    1
    hai,
    i want override a alert box, please send me a details code for this


    by
    chandiran.r

  9. #9
    Join Date
    Feb 2003
    Location
    Michigan, USA
    Posts
    5,773

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles