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

RE: [ydn-javascript] Panel never displays

Expand Messages
  • Bart King
    Hello, Try changing: myPanel.render(); To: myPanel.render(document.body); You may want to add in a myPanel.show() after the render call, just in case/for
    Message 1 of 3 , Sep 5, 2006
    • 0 Attachment
      Hello,

      Try changing:

      myPanel.render();

      To:

      myPanel.render(document.body);

      You may want to add in a myPanel.show() after the render call, just in
      case/for completeness. Also, make sure you have CSS styles defined for
      classes 'module, 'overlay' and 'mask' (and all the sub-classes thereof -
      check the assets in build\container\assets\container.css).

      Cheers,
      --
      Bart King
      http://www.bart666.com -- +44 781 219 5654


      -----Original Message-----
      From: ydn-javascript@yahoogroups.com
      [mailto:ydn-javascript@yahoogroups.com] On Behalf Of themidnightwill
      Sent: 05 September 2006 03:53
      To: ydn-javascript@yahoogroups.com
      Subject: [ydn-javascript] Panel never displays

      Hello,

      I'm having problems getting a panel (essentially copied from Yahoo's
      example). I've tried IE and Firefox without luck.

      Nothing shows up on the Firefox JS console, and IE doesn't seem to
      generate any errors. The JS files load fine (they're not 404 errors).

      I have included the code below. I must be missing something obvious.
      Any comments would be appreciated.

      Thanks,

      -Will

      ....


      <script type="text/javascript" src="/y/yahoo/yahoo.js"></script>
      <script type="text/javascript" src="/y/dom/dom.js"></script>
      <script type="text/javascript" src="/y/event/event.js"></script>
      <script type="text/javascript" src="/y/animation/animation.js"></script>
      <script type="text/javascript" src="/y/dragdrop/dragdrop.js"></script>
      <script type="text/javascript" src="/y/container/container.js"></script>
      <script type="text/javascript">

      //The second argument passed to the
      //constructor is a configuration object:
      myPanel = new YAHOO.widget.Panel("win", {
      width:"400px",
      fixedcenter: true,
      constraintoviewport: true,
      underlay:"shadow",
      close:true,
      visible:false,
      draggable:true} );

      //If we haven't built our panel using existing markup,
      //we can set its content via script:
      myPanel.setHeader("The Panel Control");
      myPanel.setBody("Testing the body...");

      myPanel.render();

      </script>
      </head>

      <body>

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


      ...






      Yahoo! Groups Links
    • themidnightwill
      Hi Bart, Thanks so much for the response. I got it working, but with some additional edits. I had to put myPanel.render(document.body); after the tag.
      Message 2 of 3 , Sep 5, 2006
      • 0 Attachment
        Hi Bart,


        Thanks so much for the response. I got it working, but with some
        additional edits.

        I had to put myPanel.render(document.body); after the <body> tag.
        That seems to make sense to me. Then show() works fine.

        The final code (included whole doc):


        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
        Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
        transitional.dtd">
        <html xmlns="http://www.w3.org/1999/xhtml">
        <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-
        1" />
        <title>Testing Dialog</title>
        <link rel="stylesheet" type="text/css"
        href="/y/container/assets/container.css" />
        <script type="text/javascript" src="/y/yahoo/yahoo.js"></script>
        <script type="text/javascript" src="/y/dom/dom.js"></script>
        <script type="text/javascript" src="/y/event/event.js"></script>
        <script type="text/javascript"
        src="/y/animation/animation.js"></script>
        <script type="text/javascript" src="/y/dragdrop/dragdrop.js"></script>
        <script type="text/javascript"
        src="/y/container/container.js"></script>
        <script type="text/javascript">

        //The second argument passed to the
        //constructor is a configuration object:
        myPanel = new YAHOO.widget.Panel("win", {
        width:"400px",
        fixedcenter: true,
        constraintoviewport: true,
        underlay:"shadow",
        modal: true,
        close:false,
        visible:false,
        draggable:false} );

        //If we haven't built our panel using existing markup,
        //we can set its content via script:
        myPanel.setHeader("Title");
        myPanel.setBody("testing.....");


        </script>
        </head>

        <body>
        <script type="text/javascript">myPanel.render(document.body);</script>

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

        </body>
        </html>










        --- In ydn-javascript@yahoogroups.com, "Bart King" <bart@...> wrote:
        >
        > Hello,
        >
        > Try changing:
        >
        > myPanel.render();
        >
        > To:
        >
        > myPanel.render(document.body);
        >
        > You may want to add in a myPanel.show() after the render call, just
        in
        > case/for completeness. Also, make sure you have CSS styles defined
        for
        > classes 'module, 'overlay' and 'mask' (and all the sub-classes
        thereof -
        > check the assets in build\container\assets\container.css).
        >
        > Cheers,
        > --
        > Bart King
        > http://www.bart666.com -- +44 781 219 5654
        >
        >
        > -----Original Message-----
        > From: ydn-javascript@yahoogroups.com
        > [mailto:ydn-javascript@yahoogroups.com] On Behalf Of themidnightwill
        > Sent: 05 September 2006 03:53
        > To: ydn-javascript@yahoogroups.com
        > Subject: [ydn-javascript] Panel never displays
        >
        > Hello,
        >
        > I'm having problems getting a panel (essentially copied from Yahoo's
        > example). I've tried IE and Firefox without luck.
        >
        > Nothing shows up on the Firefox JS console, and IE doesn't seem to
        > generate any errors. The JS files load fine (they're not 404
        errors).
        >
        > I have included the code below. I must be missing something obvious.
        > Any comments would be appreciated.
        >
        > Thanks,
        >
        > -Will
        >
        > ....
        >
        >
        > <script type="text/javascript" src="/y/yahoo/yahoo.js"></script>
        > <script type="text/javascript" src="/y/dom/dom.js"></script>
        > <script type="text/javascript" src="/y/event/event.js"></script>
        > <script type="text/javascript"
        src="/y/animation/animation.js"></script>
        > <script type="text/javascript"
        src="/y/dragdrop/dragdrop.js"></script>
        > <script type="text/javascript"
        src="/y/container/container.js"></script>
        > <script type="text/javascript">
        >
        > //The second argument passed to the
        > //constructor is a configuration object:
        > myPanel = new YAHOO.widget.Panel("win", {
        > width:"400px",
        > fixedcenter: true,
        > constraintoviewport: true,
        > underlay:"shadow",
        > close:true,
        > visible:false,
        > draggable:true} );
        >
        > //If we haven't built our panel using existing markup,
        > //we can set its content via script:
        > myPanel.setHeader("The Panel Control");
        > myPanel.setBody("Testing the body...");
        >
        > myPanel.render();
        >
        > </script>
        > </head>
        >
        > <body>
        >
        > <form name="dialog">
        > <input type="button" value="Test" onclick="myPanel.show()" />
        > </form>
        >
        >
        > ...
        >
        >
        >
        >
        >
        >
        > Yahoo! Groups Links
        >
      Your message has been successfully submitted and would be delivered to recipients shortly.