Function not being called on dialog open

Function not being called on dialog open

I would like the function dialog_close() to be called when the dialog opens.  The web page has two buttons, one to open the dialog and the other to close the dialog. These buttons are just for testing, for now. 

If you click the OPEN button the dialog opens but it never closes.  If you then click the CLOSE button the dialog closes after a 3 second delay.  

If you then click the OPEN button again, the dialog opens again. But, clicking the CLOSE button again does not cause the dialog to close, and neither can you close the dialog using the default close button.

So, I have two problems but for now can we just try and solve the first problem which is the function dialog_close() is not being called when the dialog opens?

Thanks,
TD

  2. <!DOCTYPE html>
  3. <html>
  4. <head>
  5. <meta charset="utf-8">
  6. <meta name="viewport" content="width=device-width, initial-scale=1" />
  7. <title>Fire Service Manager - Mobile</title>

  9. <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

  11. <script type="text/javascript" src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
  12. <link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
  14. <script type="text/javascript" src="captcha/src/captcha.min.js"></script>
  16. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  18. <style>
  19. body {
  20. background-color: black;
  21. }
  22. </style>
  23. <script>
  24. function login(){
  25. $("#dialog_login").dialog({
  26. autoOpen: false,
  27. modal: true,
  28. title: "Login Status",
  29.     open: function(){
  30. dialog_close()
  31.     }, 
  32. close: function(){
  33. clrflds()
  34. }
  35. });
  36. $("#dialog_login").html("<br /><div>Login Failed...</div>");
  37. $("#dialog_login").dialog("open");
  38. }
  39. function dialog_close(){
  40. setTimeout(function(){$("#dialog_login").dialog("close");}, 3000);
  41. }
  42. </script>
  43. </head>
  44. <body>
  45. <button onclick="login()">OPEN</button>
  46. <button onclick="dialog_close()">CLOSE</button>
  48. <div id="dialog_login"></div>
  49. </body>
  50. </html>