Simple Modal Dialog
-
Hi, I need a Modal Dialog for a customer to submit their account code and password. I have put the following Java Script together:-
<!--
function LoginToAccount() {
window.open("LogIn/LoginForm.html", "","width=350,height=150")
}
//-->It works of sorts, the form appears on the screen, but:- - it appears at the Top Left Corner rather than Centre Screen - It contains the Source Bar, and all the windows furniture. - The Dialog is not Modal. Is there a way to remedie this, or am I totally on the wrong path. Kind Regards, :):)
Bram van Kampen
-
Hi, I need a Modal Dialog for a customer to submit their account code and password. I have put the following Java Script together:-
<!--
function LoginToAccount() {
window.open("LogIn/LoginForm.html", "","width=350,height=150")
}
//-->It works of sorts, the form appears on the screen, but:- - it appears at the Top Left Corner rather than Centre Screen - It contains the Source Bar, and all the windows furniture. - The Dialog is not Modal. Is there a way to remedie this, or am I totally on the wrong path. Kind Regards, :):)
Bram van Kampen
There used to be a
showModalDialogmethod that would work for this, but it's no longer supported in anything other than Internet Explorer and Safari:Window.showModalDialog() - Web APIs | MDN[^]:
This method was removed in Chrome 43, and Firefox 56.
There's the
<dialog>element, which is meant to be the replacement for this method. But it's not supported in IE, Edge, or Safari, and needs to be explicitly enabled in Firefox. There's a polyfill available, but I can't see any obvious mention of which browsers it supports. <dialog>: The Dialog element - HTML: HyperText Markup Language | MDN[^] GitHub - GoogleChrome/dialog-polyfill: Polyfill for the HTML dialog element[^] There are other script options available - for example, Bootstrap's Modal[^] or jQuery UI's Dialog[^].
"These people looked deep within my soul and assigned me a number based on the order in which I joined." - Homer
