Click here to Skip to main content
Click here to Skip to main content
Add your own
alternative version

Server Side MessageBox

, 19 Sep 2005
A web (modal) messagebox without popup.
server_side_messagebox_src.zip
MessageBox
WebSite1
App_Data
Resources
img
bilgi.gif
soru.gif
top_menu_back.gif
uyari.gif
<%@ Control Language="c#" Inherits="msg.Mbox" CodeFile="Mbox.ascx.cs" %>

<script>


 
function addEvent(obj, evType, fn){
 if (obj.addEventListener){
    obj.addEventListener(evType, fn, true);
    return true;
 } else if (obj.attachEvent){
    var r = obj.attachEvent("on"+evType, fn);
    return r;
 } else {
    return false;
 }
}
function removeEvent(obj, evType, fn, useCapture){
  if (obj.removeEventListener){
    obj.removeEventListener(evType, fn, useCapture);
    return true;
  } else if (obj.detachEvent){
    var r = obj.detachEvent("on"+evType, fn);
    return r;
  } else {
    alert("Handler could not be removed");
  }
}

 function getViewportHeight() {
	if (window.innerHeight!=window.undefined) return window.innerHeight;
	if (document.compatMode=='CSS1Compat') return document.documentElement.clientHeight;
	if (document.body) return document.body.clientHeight; 
	return window.undefined; 
}
function getViewportWidth() {
	if (window.innerWidth!=window.undefined) return window.innerWidth; 
	if (document.compatMode=='CSS1Compat') return document.documentElement.clientWidth; 
	if (document.body) return document.body.clientWidth; 
	return window.undefined; 
}
 
// Popup code
var ControlName
var gPopupMask = null;
var gPopupContainer = null;
var gPopFrame = null;
var gReturnFunc;
var gPopupIsShown = false;

var gHideSelects = false;


var gTabIndexes = new Array();

var gTabbableTags = new Array("A","BUTTON","TEXTAREA","INPUT","IFRAME");	


if (!document.all) {
	document.onkeypress = keyDownHandler;
}


function initPopUp() {
	gPopupMask = document.getElementById(ControlName + "_popupMask");
	
	gPopupContainer = document.getElementById(ControlName + "_popupContainer");
	//gPopFrame = document.getElementById("popupFrame");	
	

	var brsVersion = parseInt(window.navigator.appVersion.charAt(0), 10);
	if (brsVersion <= 6 && window.navigator.userAgent.indexOf("MSIE") > -1) {
		gHideSelects = true;
	}
}
addEvent(window, "load", initPopUp);

function showPopWin(Caption, returnFunc,cn) {
    ControlName=cn
	initPopUp();
	width=350;
	height=150;
	gPopupIsShown = true;
	disableTabIndexes();
	gPopupMask.style.display = "block";
	gPopupContainer.style.display = "block";
 
	centerPopWin(width, height);
	
	var titleBarHeight = parseInt(document.getElementById(ControlName + "_popupTitleBar").offsetHeight, 10);
	
	gPopupContainer.style.width = width + "px";
	gPopupContainer.style.height = (height+titleBarHeight) + "px";
 
 //	gPopFrame.style.width = parseInt(document.getElementById("popupTitleBar").offsetWidth, 10) + "px";
	//gPopFrame.style.height = px";
	
	// set the url
	//gPopFrame.src = url;
	
	
	gReturnFunc = returnFunc;
	// for IE
	if (gHideSelects == true) {
		hideSelectBoxes();
	}
	
	//window.setTimeout("setPopTitle();", 600);
	setPopTitle(Caption);
}

//
var gi = 0;
function centerPopWin(width, height) {
	if (gPopupIsShown == true) {
		if (width == null || isNaN(width)) {
			width = gPopupContainer.offsetWidth;
		}
		if (height == null) {
			height = gPopupContainer.offsetHeight;
		}
		
		var fullHeight = getViewportHeight();
		var fullWidth = getViewportWidth();
		
		var theBody = document.documentElement;
		
		var scTop = parseInt(theBody.scrollTop,10);
		var scLeft = parseInt(theBody.scrollLeft,10);
		
		gPopupMask.style.height = fullHeight + "px";
		gPopupMask.style.width = fullWidth + "px";
		gPopupMask.style.top = scTop + "px";
		gPopupMask.style.left = scLeft + "px";
		
		window.status = gPopupMask.style.top + " " + gPopupMask.style.left + " " + gi++;
		
		var titleBarHeight = parseInt(document.getElementById(ControlName + "_popupTitleBar").offsetHeight, 10);
		
		gPopupContainer.style.top = (scTop + ((fullHeight - (height+titleBarHeight)) / 2)) + "px";
		gPopupContainer.style.left =  (scLeft + ((fullWidth - width) / 2)) + "px";
		//alert(fullWidth + " " + width + " " + gPopupContainer.style.left);
	}
}
addEvent(window, "resize", centerPopWin);
//addEvent(window, "scroll", centerPopWin);
window.onscroll = centerPopWin;

 function hidePopWin(callReturnFunc) {
	gPopupIsShown = false;
	restoreTabIndexes();
	if (gPopupMask == null) {
		return;
	}
	gPopupMask.style.display = "none";
	gPopupContainer.style.display = "none";
	if (callReturnFunc == true && gReturnFunc != null) {
		gReturnFunc(window.frames["popupFrame"].returnVal);
	}
	//gPopFrame.src = 'loading.html';
	// display all select boxes
	if (gHideSelects == true) {
		displaySelectBoxes();
	}
}

   
function setPopTitle(Caption) {
	
		document.getElementById(ControlName + "_popupTitle").innerHTML =  Caption;

}

 function keyDownHandler(e) {
    if (gPopupIsShown && e.keyCode == 9)  return false;
}

 function disableTabIndexes() {
	if (document.all) {
		var i = 0;
		for (var j = 0; j < gTabbableTags.length; j++) {
			var tagElements = document.getElementsByTagName(gTabbableTags[j]);
			for (var k = 0 ; k < tagElements.length; k++) {
				gTabIndexes[i] = tagElements[k].tabIndex;
				tagElements[k].tabIndex="-1";
				i++;
			}
		}
	}
}


function restoreTabIndexes() {
	if (document.all) {
		var i = 0;
		for (var j = 0; j < gTabbableTags.length; j++) {
			var tagElements = document.getElementsByTagName(gTabbableTags[j]);
			for (var k = 0 ; k < tagElements.length; k++) {
				tagElements[k].tabIndex = gTabIndexes[i];
				tagElements[k].tabEnabled = true;
				i++;
			}
		}
	}
}




function hideSelectBoxes() {
	for(var i = 0; i < document.forms.length; i++) {
		for(var e = 0; e < document.forms[i].length; e++){
			if(document.forms[i].elements[e].tagName == "SELECT") {
				document.forms[i].elements[e].style.visibility="hidden";
			}
		}
	}
}

function displaySelectBoxes() {
	for(var i = 0; i < document.forms.length; i++) {
		for(var e = 0; e < document.forms[i].length; e++){
			if(document.forms[i].elements[e].tagName == "SELECT") {
			document.forms[i].elements[e].style.visibility="visible";
			}
		}
	}
}
</script>
<div id="popupMask" visible=false  runat=server  style="position: absolute;
	z-index: 200;
	top: 0px;
	left: 0px;
	width: 100%;
	border: red 2px solid;
	height: 100%;
	opacity: .4;
	filter: alpha(opacity=0);

	background-color:transparent !important;
	background-color: #333333;

	background-image/**/: url('maskBG.png') !important; 
	background-image:none;
	background-repeat: repeat;
	display:none;
">
    
</div>
<table id=DesignTable runat=server  bgcolor=#E0E9F8>
<tr>
<td>MessageBox</td>
</tr>
</table>
<div runat=server id="popupContainer"  visible=false style="  width:35; height:15;	position: absolute;
	z-index: 201;
	top: 0px;
	left: 0px;
	display:none;
	padding: 0px;">
	<div id="popupInner" runat=server>
		<div id="popupTitleBar" runat=server style="	
	font-weight: bold;
	height: 1.3em;
	padding: 5px;
	position: relative;
	z-index: 203; 
">
			<div runat=server id="popupTitle" style="	float:left;
	font-size: 1.1em;"></div>
			<div runat=server id="popupControls" style="	float: right;
	cursor: pointer;
	cursor: hand;">
				<!-- <img src="close.gif" onclick="hidePopWin(false);" /> -->
			</div>
		</div>
		
			
			<TABLE   runat = server id= MainTable name = MainTable style="" width=100% height=100% border="0">
				<TR>
					<TD style="WIDTH: 62px; HEIGHT: 96px" vAlign="middle" align="center"><asp:image id="iIcon" runat="server"></asp:image></TD>
					<TD style="HEIGHT: 96px" vAlign="middle" align="left" colSpan="3"><asp:label id="lblMessage" runat="server" Width="100%" Height="100%" ForeColor="#1F336B" Font-Names="Arial"
							Font-Size="Smaller"></asp:label></TD>
				</TR>
				<TR align="center">
					<TD style="WIDTH: 62px; height: 26px;"></TD>
					<TD vAlign="bottom" align="right" style="height: 26px"><asp:button id="btn1" runat="server" Text="Button"  CssClass="button" 
							 OnClick="btn1_Click" Width="60px"></asp:button><asp:button id="btn2" runat="server" Text="Button"  CssClass="button" 
							OnClick="btn2_Click" Width="60px"></asp:button><asp:button id="btn3" runat="server" Text="Button" 
							 OnClick="btn3_Click" Width="60px"></asp:button></TD>
				</TR>
			</TABLE>
		
		
	</div>
	
	</div>

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here

Share

About the Author

Kivanc Ozuolmez
Software Developer
Netherlands Netherlands
No Biography provided

| Advertise | Privacy | Terms of Use | Mobile
Web04 | 2.8.150129.1 | Last Updated 19 Sep 2005
Article Copyright 2005 by Kivanc Ozuolmez
Everything else Copyright © CodeProject, 1999-2015
Layout: fixed | fluid