Introduction
In case of problems understanding - please see the previous article:
http://www.codeproject.com/script/Articles/ArticleVersion.aspx?waid=98725&aid=672776
Using the code
This code uses three JavaScript functions to open an overlay with content from a Session which was typecast from MyNamespace.MyClass
(se how in the link above).
The overlay contains two <a>
tags that onClick
fires individual functions that closes the overlay and if it is the 'Correct' function, then it sets a value on an asp:Textbox
via its id.
function SetName() {
window.showWindow.style.display = "none";
window.showWindow.innerHTML = '';
document.getElementById("txtName").value = '<%= (Session["MyClass"] as MyClass).getName() %>';
}
function CloseWindow() {
window.showWindow.style.display = "none";
window.showWindow.innerHTML = '';
}
function OpenWindow(){
window.showWindow = document.getElementById('Overlay');
if (window.showWindow.style.display == "none") {
window.showWindow.style.display = "";
window.showWindow.innerHTML =
'<center>'
+ '<h1>Navn: <%= (Session["MyClass"] as MyClass).getName() %></h1><br />'
+ '<a href="#" onclick="return SetName();">Correct</a> - '
+ '<a href="#" onclick="return CloseWindow();">
}
}
Notice the use of <%= (Session["MyClass"] as MyClass).getName() %>
this needs registration of namespace in web.config or elsewhere. Also notice the use of the quotes - if you use ' on the outside you can use " on the inside. This also works the other way around, but I was unable to escape using \", so if you are doing eg.
<asp:textbox id="txtName" runat="server" text="<%= <br />cleverThingHere.ToString() %>"/>
in the innerhtml - remember to use this correctly.
The overlay Overlay
needs the following style:
#Overlay{
z-index: 99;
filter: alpha(opacity=95);
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=95);
-moz-opacity: .95;
-khtml-opacity: 0.95;
opacity: 0.95;
background-color:#FFFFFF;
position:fixed; top:13%; left:25%; color:#000000; min-width:900px;
}
and the following div tag in ASPX:
<div id="displaybox" style="display: none;"></div>
History
-
Version 1.0.0.0 - let me know if there are bugs :)