I want to have a pop-up modal appear on the new requests page. I have it working as I want with the below code. The problem I'm having is: When the page opens it pops up (good). But when the form (we have multiple) is chosen it pops up again (not good).
One or the other is ok, preferably the latter - after they select the form. Just need it to show once. Any help is appreciated. I am not a coder so if you have solution please treat me as a simpleton. Thanks!
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
#dialogoverlay{
display: none;
opacity: .8;
position: fixed;
top: 0px;
left: 0px;
background: #FFF;
width: 100%;
z-index: 10;
}
#dialogbox{
display: none;
position: fixed;
background: #000;
border-radius:7px;
width:550px;
z-index: 10;
}
#dialogbox > div{ background:#FFF; margin:8px; }
#dialogbox > div > #dialogboxhead{ background: #FFFF00; font-size:19px; padding:10px; color:#FF0040; }
#dialogbox > div > #dialogboxbody{ background:#000; padding:20px; color:#fff; }
#dialogbox > div > #dialogboxfoot{ background: #666; padding:10px; text-align:right; }
</style>
<script>
function CustomAlert(){
this.render = function(dialog){
var winW = window.innerWidth;
var winH = window.innerHeight;
var dialogoverlay = document.getElementById('dialogoverlay');
var dialogbox = document.getElementById('dialogbox');
dialogoverlay.style.display = "block";
dialogoverlay.style.height = winH+"px";
dialogbox.style.left = (winW/2) - (550 * .5)+"px";
dialogbox.style.top = "100px";
dialogbox.style.display = "block";
document.getElementById('dialogboxhead').innerHTML = "NOTICE - please read!";
document.getElementById('dialogboxbody').innerHTML = dialog;
document.getElementById('dialogboxfoot').innerHTML = '<button onclick="Alert.ok()">OK</button>';
}
this.ok = function(){
document.getElementById('dialogbox').style.display = "none";
document.getElementById('dialogoverlay').style.display = "none";
}
}
var Alert = new CustomAlert();
</script>
</head>
<body onload="Alert.render('If the request you want to submit is not listed as an option please contact a supervisor for triage and action. Additional reporting channels are available to them. (Examples include MDT, OA, intra/internet, console furniture, etc.)')">
<div id="dialogoverlay"></div>
<div id="dialogbox">
<div>
<div id="dialogboxhead"></div>
<div id="dialogboxbody"></div>
<div id="dialogboxfoot"></div>
</div>
</div>
</body>
</html>