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

issue with tabview and select boxes

Expand Messages
  • moore234
    Hi folks, I have an existing php site that I m trying to put into a tabview. I am running into a strange error, and I m at a loss as to how to debug it.
    Message 1 of 3 , Nov 30, 2006
    • 0 Attachment
      Hi folks,

      I have an existing php site that I'm trying to put into a tabview. I
      am running into a strange error, and I'm at a loss as to how to debug it.

      Basically, in FF1.5 (one of the A-grade browsers, according to the
      support chart:
      http://yuiblog.com/blog/2006/11/15/browser-support-update-2006q4/), I
      see all of the tab content on the first tab. One the 2nd and other
      tabs, I see all tab content but the first tab's. This works fine on IE6.

      These tabs contain lots of content--divs, forms, iframes, etc. I
      wasn't able to find any limits on what a tab view could contain by
      searching the documentation and this list. But the examples are
      pretty simple.

      Anyway, I tracked it down to the options in a select box. If I don't
      have any options, the tabs render correctly, but if I do, I see the
      behavior mentioned above. This blows my mind, as I can't see how
      options in a select box would have any effect on the tabview component
      at all.

      Now, I tried to simplify and give y'all a sample of the problem, but
      unfortunately, it works when it's simple:
      http://www.mooreds.com/yui/test.html

      So, I wanted to ask you how to debug this problem? I looked in the
      yui documentation and found the logger class, but I don't really do
      any javascript manipulations. I didn't see a way to flip logging on
      for the tabview class, but might have missed it. Are there any
      requirements for the content in the tabview--does it have to be well
      formed? Are there any html elements disallowed?

      I am planning to add my content bit by bit to a tab, but any hints as
      to this bizarre behavior or how you debug the YUI components in
      general would be appreciated.

      Thanks,
      Dan
    • Pierre Goiffon
      ... Date : Thu, 30 Nov 2006 17:15:51 -0000 De : moore234 Répondre à : ydn-javascript@yahoogroups.com Objet : [ydn-javascript] issue with
      Message 2 of 3 , Nov 30, 2006
      • 0 Attachment
        ----- Message de moore234@... ---------
        Date : Thu, 30 Nov 2006 17:15:51 -0000
        De : moore234 <moore234@...>
        Répondre à : ydn-javascript@yahoogroups.com
        Objet : [ydn-javascript] issue with tabview and select boxes
        À : ydn-javascript@yahoogroups.com

        > I have an existing php site that I'm trying to put into a tabview. I
        > am running into a strange error, and I'm at a loss as to how to debug it.
        >
        > Basically, in FF1.5 (...)
        > I see all of the tab content on the first tab. One the 2nd and other
        > tabs, I see all tab content but the first tab's. This works fine on IE6.
        (...)
        > Now, I tried to simplify and give y'all a sample of the problem, but
        > unfortunately, it works when it's simple:
        > http://www.mooreds.com/yui/test.html

        I saw also the problem using a Windows Firefox 1.5.0.8

        I was first thinking it could be because of incorrect nested elements
        or div that aren't closed. So I tryed the W3C validator and gets
        errors because you aern't neither specifying a doctype nor a charset
        information :
        <http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.mooreds.com%2Fyui%2Ftest.html>
        Even if you're forcing the 2 informations in the validator you still
        gets an error : I think it's because of the lack of the title element
        in the head section ? You certainly should write valid HTML...

        Owever, I just see something really strange : after reloading the page
        (Firefox certainly gets it from the cache) I don't see the problem
        again, the correct contents are displayed where they should be.
        Reloading with Ctrl + Shift + reload to avoid cache and the problem is
        back... Try to instanciate your tabView object after the markup or
        into an body onLoad event maybe ?
      • moore234
        Hi Pierre, I made sure my application validated with HTML transitional (I can t use html strict because I need the target attribute of the form,
        Message 3 of 3 , Dec 1, 2006
        • 0 Attachment
          Hi Pierre,

          I made sure my application validated with HTML transitional (I can't
          use html strict because I need the target attribute of the form,
          unfortunately). Testing with FF 1.5.0.8, I still saw the problem with
          the tab view not rendering correctly, but at least I saw the behavior
          you mentioned: reloading from the server displayed the problem, but
          reloading from cache did not.

          I then followed your advice to put the tabview instantiation into a
          window.onload function and it worked. The javascript that worked for me:

          ----------------
          function addLoadEvent(func) {
          var oldonload = window.onload;
          if (typeof window.onload != 'function') {
          window.onload = func;
          } else {
          window.onload = function() {
          if (oldonload) {
          oldonload();
          }
          func();
          }
          }
          }

          addLoadEvent( function() {
          var myTabs = new YAHOO.widget.TabView("app");
          } );
          ----------------

          I put this where the examples just have the object instantiation.

          addLoadEvent is from
          http://simon.incutio.com/archive/2004/05/26/addLoadEvent

          I should have mentioned in the original post that I am using version
          0.12.0 of the YUI.

          Thanks again for your help!

          Dan

          --- In ydn-javascript@yahoogroups.com, Pierre Goiffon <pgoiffon@...>
          wrote:
          >
          > ----- Message de moore234@... ---------
          > Date : Thu, 30 Nov 2006 17:15:51 -0000
          > De : moore234 <moore234@...>
          > Répondre à : ydn-javascript@yahoogroups.com
          > Objet : [ydn-javascript] issue with tabview and select boxes
          > À : ydn-javascript@yahoogroups.com
          >
          > > I have an existing php site that I'm trying to put into a tabview. I
          > > am running into a strange error, and I'm at a loss as to how to
          debug it.
          > >
          > > Basically, in FF1.5 (...)
          > > I see all of the tab content on the first tab. One the 2nd and other
          > > tabs, I see all tab content but the first tab's. This works fine
          on IE6.
          > (...)
          > > Now, I tried to simplify and give y'all a sample of the problem, but
          > > unfortunately, it works when it's simple:
          > > http://www.mooreds.com/yui/test.html
          >
          > I saw also the problem using a Windows Firefox 1.5.0.8
          >
          > I was first thinking it could be because of incorrect nested elements
          > or div that aren't closed. So I tryed the W3C validator and gets
          > errors because you aern't neither specifying a doctype nor a charset
          > information :
          >
          <http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.mooreds.com%2Fyui%2Ftest.html>
          > Even if you're forcing the 2 informations in the validator you still
          > gets an error : I think it's because of the lack of the title element
          > in the head section ? You certainly should write valid HTML...
          >
          > Owever, I just see something really strange : after reloading the page
          > (Firefox certainly gets it from the cache) I don't see the problem
          > again, the correct contents are displayed where they should be.
          > Reloading with Ctrl + Shift + reload to avoid cache and the problem is
          > back... Try to instanciate your tabView object after the markup or
          > into an body onLoad event maybe ?
        Your message has been successfully submitted and would be delivered to recipients shortly.