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

Re: Making a panel visible directly with javascript instead of listener

Expand Messages
  • Jacques
    I got it half working but I think my implementation is wrong. I have a URL you can look at http://www.vimarksolutions.com/admin the login box is fake. Click
    Message 1 of 3 , May 1, 2008
    • 0 Attachment
      I got it half working but I think my implementation is wrong.

      I have a URL you can look at

      http://www.vimarksolutions.com/admin

      the login box is fake.

      Click investors, then click on a name. Now click the name 5-6 times
      and then drag the detail box around...

      I added the following to an onclick to get this effect

      YAHOO.example.container.panel4 = new YAHOO.widget.Panel('panel4', {
      visible:true } );
      YAHOO.example.container.panel4.hide();
      YAHOO.example.container.panel4.render();

      Is there a way for me to make panel4 visible without creating a new
      instance of it?

      --- In ydn-javascript@yahoogroups.com, "Jacques" <news@...> wrote:
      >
      > I have a panel that I need to make visible with pure javascript not
      > any of the listeners.
      >
      > the reason is because there are multiple of these objects, and it
      > would be unreasonable in my situation to create a listener for each
      > object.
      >
      > more detailed explanation:
      >
      > I have a list of products in a table that is dynamically generated
      > from a database. I want to take make each of the products in the table
      > a link that pushes a URL into a specific. The url is always slightly
      > different to accomodate for the different ID of the product, but the
      > panel is always the same panel. Make sense?
      >
    • bretlevy
      Once the panel is rendered, you can show/hide it with the show/hide methods of the panel object, like you are doing. In the constructor, having visible:false
      Message 2 of 3 , May 1, 2008
      • 0 Attachment
        Once the panel is rendered, you can show/hide it with the show/hide
        methods of the panel object, like you are doing. In the constructor,
        having visible:false will simply create the panel, which may have an
        empty body (bd). That's fine, it won't be visible.

        You can put any arbitrary data you want inside the panel at any time,
        while it is visible or hidden. For example, if you have this html:

        <div id="myPanel">
        <div class="hd"></div>
        <div class="bd">
        <div id="myPanelContents"></div>
        </div>
        </div>

        Then you instantiate it in your init code, for example:

        YAHOO.example.myPanel = new YAHOO.widget.Panel("myPanel", {
        modal:false, draggable:true, underlay:"shadow", visible:false,
        fixedcenter:false, constraintoviewport:true, close:false } );
        YAHOO.example.myPanel.render();

        You show/hide it with:

        YAHOO.example.myPanel.show() or YAHOO.example.myPanel.hide()

        And you "put data into it" by setting the innerHTML on
        element "myPanelContents".

        YAHOO.util.Dom.get("myPanelContents").innerHTML = snippet;

        Where snippet is the HTML/markup you want to insert. That markup may
        come from a server, be built in javascript, or could even be
        just "fields" that you stik into form input elements.

        You can also fetch data from a server and update an existing table in
        the panel. If you have a datatable object you can replace its data
        with newly fetched data from the server (in the same format) by calling:

        myTableObject.getRecordSet().replaceRecords(myNewData);
        myTableObject.render();

        Make sure to call render afterwards in the newer YUI's.

        I actually maintain a global flag in my page for each table I
        dynamically build, and if set, I know to instantiate the table object
        and setup the record defs, etc, otherwise I just do the replace records
        approach. That way, I only create my objects once, and never destroy
        them. Only hide them.

        Hope that helps...

        ~~bret





        --- In ydn-javascript@yahoogroups.com, "Jacques" <news@...> wrote:
        >
        > I have a panel that I need to make visible with pure javascript not
        > any of the listeners.
        >
        > the reason is because there are multiple of these objects, and it
        > would be unreasonable in my situation to create a listener for each
        > object.
        >
        > more detailed explanation:
        >
        > I have a list of products in a table that is dynamically generated
        > from a database. I want to take make each of the products in the table
        > a link that pushes a URL into a specific. The url is always slightly
        > different to accomodate for the different ID of the product, but the
        > panel is always the same panel. Make sense?
        >
      Your message has been successfully submitted and would be delivered to recipients shortly.