Display div content in a modal dialog

cluM09 · Feb 23, 2008

Hello,

I am new to html programmimg. I need help with displaying the div content in a modal dialog box or the showhelp window.

I need to have modal dialog box since I want user to respond to the information in the modal message.
Also inside the modal dialog box, I want to show a button for the user to close the modal dialog box.

So far I have the following code:

Inside the <head> section, I have:

<style type="text/css">
div {
position: absolute;
left: 100px;
top: 200px;
background-color: #f1f1f1;
width: 180px;
padding: 10px;
color: black;
border: #0000cc 2px Solid;
display: none;
}
</style>

In the <Script> section, I have:

Sub Help()
document.getElementById("Helpcontent").style.display = "inline"
End Sub

Sub HideHelp()
document.getElementById("Helpcontent").style.display = "none"
End Sub

Sub ShowModal()
window.showModalDialog("Helpcontent")
End Sub

The Help subroutine shows the help dialog box, but it is not a modal dialog box.

The ShowModal subroutine does not show the content of the
div content. It shows a blank html page as a modal dialog box.

In <body> section, I have:

<input type=button name="Show" value="Show Help" onclick="Help">

<DIV id="Helpcontent" STYLE="background-color:white;Height:210;Width:400;font:14pt arial;">
<CENTER>
<br><br>
A Sample HTA<br>
This is a help window screen<br><br><br>
<font size="2" face="Arial">Here will be the area that contains the help information</font>
<hr />
<input class="button" TYPE=BUTTON style="width:80;height:22" value="Close" name="btnHelp" onClick="HideHelp">
</CENTER>
</DIV>

Is it possible to have the ShowModal subroutine to show the div content?

Thanks.

CluM09

Vragabond · Feb 23, 2008

In your css you're defining very specific values regarding your modal box to all the divs. That's a bad idea since div is such a building block of all websites -- you're likely to experience a lot of problems with that. I suggest you change your css to not relate to div but to #Helpcontent instead.

Additionally, I have no idea why you have extra inline styles for the Helpcontent box.

However, most of your problem stems from the script. It looks like you're using VBScript, which will only work in IE. I suggest you rewrite it to javascript so that it will work in all browsers. Then visit forum216 to get help on how to fix your javascript.

___________________________________________________________
[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]

cluM09 · Feb 24, 2008

Vragabond,

Thank you for the response.

How can I set the div to #Helpcontent?

The "inline" style is used to open the content within the div section just for demonstration.

I will get rid of it if the ShowModal() works.

I am using this html page as a GUI for the HTA with the VBScript I already wrote. I use it in IE for the time being. I certainly will like to use Javascript later when I get time to learn Javascript and have my other code written in Javascript.

Thanks again.

CluM09

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Display div content in a modal dialog

cluM09

Technical User

Vragabond

Programmer

cluM09

Technical User

Similar threads

Part and Inventory Search

Sponsor