Loading ...
Sorry, an error occurred while loading the content.

Dialog never displays

Expand Messages
  • tokalak.ahmet
    I have big problems showing up a dilaog box. I structured my dialog panel as recommended in the dialog tutorial, but it doesn t work. What is going wrong here?
    Message 1 of 3 , Oct 4, 2006
    • 0 Attachment
      I have big problems showing up a dilaog box.
      I structured my dialog panel as recommended in the dialog tutorial,
      but it doesn't work.
      What is going wrong here?

      Here follows the source code of my jsp-page:

      <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
      pageEncoding="ISO-8859-1"%>
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
      <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
      <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
      <html>
      <head>
      <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
      <title>SpeedCockpit - Anmeldung</title>

      <!-- Dependencies -->
      <script type="text/javascript" src="js/yui/yahoo/yahoo.js"></script>
      <script type="text/javascript" src="js/yui/dom/dom.js"></script>
      <script type="text/javascript" src="js/yui/event/event.js"></script>
      <!-- Required for performing asynchronous submission -->
      <script type="text/javascript"
      src="js/yui/connection/connection.js"></script>
      <!-- Source file -->
      <script type="text/javascript"
      src="js/yui/container/container.js"></script>
      <!-- CSS -->
      <link rel="stylesheet" type="text/css"
      href="js/yui/container/assets/container.css" />
      <!-- Set up the Login dialog -->
      <script language="javascript">
      var handleSuccess = function(o) {
      alert("Your data was successfully submitted. The response was: " +
      o.responseText);
      }
      var handleFailure = function(o) {
      alert("Your submission failed. Status: " + o.status);
      }

      var callback =
      {
      success:handleSuccess,
      failure:handleFailure,
      timeout: 5000
      };

      var handleCancel = function() {
      this.cancel();
      }

      var handleSubmit = function() {
      YAHOO.util.Connect.asyncRequest('GET', 'login', callback,
      "name=" + loginDialog.getData().name +
      "&password=" + loginDialog.getData().password
      );
      }

      var myButtons = [ { text:"Submit", handler:handleSubmit,
      isDefault:true },
      { text:"Cancel", handler:handleCancel } ];

      var loginDialog = new YAHOO.widget.Dialog("loginDialog", {
      modal:true, visible:false, width:"150px", fixedcenter:true,
      constraintoviewport:true, draggable:true });
      loginDialog.cfg.queueProperty("buttons", myButtons);

      loginDialog.render();
      loginDialog.show();

      </script>
      </head>
      <body>
      <div id="loginDialog">
      <div class="hd">Please enter your information</div>
      <div class="bd">
      <form name="dlgForm" method="GET" postmethod="async" action="">
      <p>Please enter your personal contact information:</p>
      <label for="firstname">First Name:</label><input type="textbox"
      name="firstname" />
      <label for="lastname">Last Name:</label><input type="textbox"
      name="lastname" />
      </form>
      </div>
      </div>
      </body>
      </html>
    • Steven Peterson
      It appears that you are trying to create a Dialog for markup that hasn t loaded in the page yet. Can you try initializing your Dialog in a window.load handler?
      Message 2 of 3 , Oct 4, 2006
      • 0 Attachment

        It appears that you are trying to create a Dialog for markup that hasn’t loaded in the page yet. Can you try initializing your Dialog in a window.load handler?

         

        Steven Peterson

        Web Developer, Platform Engineering

        Yahoo!

         

         

         

        From: ydn-javascript@yahoogroups.com [mailto:ydn-javascript@yahoogroups.com] On Behalf Of tokalak.ahmet
        Sent: Wednesday, October 04, 2006 4:27 AM
        To: ydn-javascript@yahoogroups.com
        Subject: [ydn-javascript] Dialog never displays

         

        I have big problems showing up a dilaog box.
        I structured my dialog panel as recommended in the dialog tutorial,
        but it doesn't work.
        What is going wrong here?

        Here follows the source code of my jsp-page:

        <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
        pageEncoding="ISO-8859-1"%>
        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
        <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
        <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
        <html>
        <head>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
        <title>SpeedCockpit - Anmeldung</title>

        <!-- Dependencies -->
        <script type="text/javascript" src="js/yui/yahoo/yahoo.js"></script>
        <script type="text/javascript" src="js/yui/dom/dom.js"></script>
        <script type="text/javascript" src="js/yui/event/event.js"></script>
        <!-- Required for performing asynchronous submission -->
        <script type="text/javascript"
        src="js/yui/connection/connection.js"></script>
        <!-- Source file -->
        <script type="text/javascript"
        src="js/yui/container/container.js"></script>
        <!-- CSS -->
        <link rel="stylesheet" type="text/css"
        href="js/yui/container/assets/container.css" />
        <!-- Set up the Login dialog -->
        <script language="javascript">
        var handleSuccess = function(o) {
        alert("Your data was successfully submitted. The response was: " +
        o.responseText);
        }
        var handleFailure = function(o) {
        alert("Your submission failed. Status: " + o.status);
        }

        var callback =
        {
        success:handleSuccess,
        failure:handleFailure,
        timeout: 5000
        };

        var handleCancel = function() {
        this.cancel();
        }

        var handleSubmit = function() {
        YAHOO.util.Connect.asyncRequest('GET', 'login', callback,
        "name=" + loginDialog.getData().name +
        "&password=" + loginDialog.getData().password
        );
        }

        var myButtons = [ { text:"Submit", handler:handleSubmit,
        isDefault:true },
        { text:"Cancel", handler:handleCancel } ];

        var loginDialog = new YAHOO.widget.Dialog("loginDialog", {
        modal:true, visible:false, width:"150px", fixedcenter:true,
        constraintoviewport:true, draggable:true });
        loginDialog.cfg.queueProperty("buttons", myButtons);

        loginDialog.render();
        loginDialog.show();

        </script>
        </head>
        <body>
        <div id="loginDialog">
        <div class="hd">Please enter your information</div>
        <div class="bd">
        <form name="dlgForm" method="GET" postmethod="async" action="">
        <p>Please enter your personal contact information:</p>
        <label for="firstname">First Name:</label><input type="textbox"
        name="firstname" />
        <label for="lastname">Last Name:</label><input type="textbox"
        name="lastname" />
        </form>
        </div>
        </div>
        </body>
        </html>

      • tokalak.ahmet
        Hi Steven, i changed the code now, but it does still not work. The dialog should pop up, when i click on the Test -button, but i does not. My goal was to show
        Message 3 of 3 , Oct 5, 2006
        • 0 Attachment
          Hi Steven,

          i changed the code now, but it does still not work. The dialog should
          pop up, when i click on the 'Test'-button, but i does not. My goal was
          to show the dialog without any user interaction like clicking the
          'show dialog button'. I mean:

          <html>
          <head>
          ...
          javascript code ...
          ...
          </head<
          <body>
          <script language="javascript">
          loginDialog.show();
          </script>
          </body>
          </html>

          But i'm far away from this.

          My code looks like this:

          <html>
          <head>
          <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
          <title>SpeedCockpit - Anmeldung</title>

          <!-- Dependencies -->
          <script type="text/javascript" src="js/yui/yahoo/yahoo.js"></script>
          <script type="text/javascript" src="js/yui/dom/dom.js"></script>
          <script type="text/javascript" src="js/yui/event/event.js"></script>
          <!-- Required for performing asynchronous submission -->
          <script type="text/javascript"
          src="js/yui/connection/connection.js"></script>
          <!-- Source file -->
          <script type="text/javascript"
          src="js/yui/container/container.js"></script>
          <!-- CSS -->
          <link rel="stylesheet" type="text/css"
          href="js/yui/container/assets/container.css" />
          <!-- Set up the Login dialog -->
          <script language="javascript">

          function init(){
          var handleSuccess = function(o) {
          alert("Your data was successfully submitted. The response was: " +
          o.responseText);
          }
          var handleFailure = function(o) {
          alert("Your submission failed. Status: " + o.status);
          }

          var callback =
          {
          success:handleSuccess,
          failure:handleFailure,
          timeout: 5000
          };

          var handleCancel = function() {
          this.cancel();
          }

          var handleSubmit = function() {
          YAHOO.util.Connect.asyncRequest('GET', 'login', callback,
          "name=" + loginDialog.getData().username +
          "&password=" + loginDialog.getData().password
          );
          }

          var myButtons = [ { text:"Submit", handler:handleSubmit,
          isDefault:true },
          { text:"Cancel", handler:handleCancel } ];

          loginDialog = new YAHOO.widget.Dialog("loginDialog", { modal:true,
          visible:false, width:"80px", height:"120px",
          underlay:"shadow",modal:true, fixedcenter:true,
          constraintoviewport:true, draggable:true });
          loginDialog.cfg.queueProperty("buttons", myButtons);
          loginDialog.render();

          }

          YAHOO.util.Event.addListener(window, "load", init);

          </script>
          </head>
          <body>

          <form name="dialog">
          <input type="button" value="Test" onclick="loginDialog.show()" />
          </form>

          <div id="loginDialog">
          <div class="hd">Please enter your information</div>
          <div class="bd">
          <form name="dlgForm" method="GET" postmethod="async" action="">
          <p>Please enter your personal contact information:</p>
          <label for="username">Name:</label><input type="textbox"
          name="firstname" />
          <label for="password">Password:</label><input type="textbox"
          name="lastname" />
          </form>
          </div>
          <div class="ft"></div>
          </div>
          </body>
          </html>


          --- In ydn-javascript@yahoogroups.com, "Steven Peterson"
          <peterson@...> wrote:
          >
          > It appears that you are trying to create a Dialog for markup that hasn't
          > loaded in the page yet. Can you try initializing your Dialog in a
          > window.load handler?
          >
          >
          >
          > Steven Peterson
          >
          > Web Developer, Platform Engineering
          >
          > Yahoo!
          >
          >
          >
          >
          >
          >
          >
          > From: ydn-javascript@yahoogroups.com
          [mailto:ydn-javascript@yahoogroups.com]
          > On Behalf Of tokalak.ahmet
          > Sent: Wednesday, October 04, 2006 4:27 AM
          > To: ydn-javascript@yahoogroups.com
          > Subject: [ydn-javascript] Dialog never displays
          >
          >
          >
          > I have big problems showing up a dilaog box.
          > I structured my dialog panel as recommended in the dialog tutorial,
          > but it doesn't work.
          > What is going wrong here?
          >
          > Here follows the source code of my jsp-page:
          >
          > <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
          > pageEncoding="ISO-8859-1"%>
          > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
          > <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
          > <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
          > <html>
          > <head>
          > <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
          > <title>SpeedCockpit - Anmeldung</title>
          >
          > <!-- Dependencies -->
          > <script type="text/javascript" src="js/yui/yahoo/yahoo.js"></script>
          > <script type="text/javascript" src="js/yui/dom/dom.js"></script>
          > <script type="text/javascript" src="js/yui/event/event.js"></script>
          > <!-- Required for performing asynchronous submission -->
          > <script type="text/javascript"
          > src="js/yui/connection/connection.js"></script>
          > <!-- Source file -->
          > <script type="text/javascript"
          > src="js/yui/container/container.js"></script>
          > <!-- CSS -->
          > <link rel="stylesheet" type="text/css"
          > href="js/yui/container/assets/container.css" />
          > <!-- Set up the Login dialog -->
          > <script language="javascript">
          > var handleSuccess = function(o) {
          > alert("Your data was successfully submitted. The response was: " +
          > o.responseText);
          > }
          > var handleFailure = function(o) {
          > alert("Your submission failed. Status: " + o.status);
          > }
          >
          > var callback =
          > {
          > success:handleSuccess,
          > failure:handleFailure,
          > timeout: 5000
          > };
          >
          > var handleCancel = function() {
          > this.cancel();
          > }
          >
          > var handleSubmit = function() {
          > YAHOO.util.Connect.asyncRequest('GET', 'login', callback,
          > "name=" + loginDialog.getData().name +
          > "&password=" + loginDialog.getData().password
          > );
          > }
          >
          > var myButtons = [ { text:"Submit", handler:handleSubmit,
          > isDefault:true },
          > { text:"Cancel", handler:handleCancel } ];
          >
          > var loginDialog = new YAHOO.widget.Dialog("loginDialog", {
          > modal:true, visible:false, width:"150px", fixedcenter:true,
          > constraintoviewport:true, draggable:true });
          > loginDialog.cfg.queueProperty("buttons", myButtons);
          >
          > loginDialog.render();
          > loginDialog.show();
          >
          > </script>
          > </head>
          > <body>
          > <div id="loginDialog">
          > <div class="hd">Please enter your information</div>
          > <div class="bd">
          > <form name="dlgForm" method="GET" postmethod="async" action="">
          > <p>Please enter your personal contact information:</p>
          > <label for="firstname">First Name:</label><input type="textbox"
          > name="firstname" />
          > <label for="lastname">Last Name:</label><input type="textbox"
          > name="lastname" />
          > </form>
          > </div>
          > </div>
          > </body>
          > </html>
          >
        Your message has been successfully submitted and would be delivered to recipients shortly.