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

Re: problem in displaying layout in IE

Expand Messages
  • aniad
    Dav, As you see in my post http://tech.groups.yahoo.com/group/ydn-javascript/message/38440 I have a similar/same issue. I ve narrowed it down to nested layout
    Message 1 of 5 , Sep 30, 2008
    • 0 Attachment
      Dav,

      As you see in my post
      http://tech.groups.yahoo.com/group/ydn-javascript/message/38440 I have
      a similar/same issue. I've narrowed it down to nested layout and
      enclosed a simple html/js which demonstrates the problem. As you will
      see in that post/code I'm creating the inner layout the way you
      suggest here, yet I persistently get the "invalid argument" error in
      IE when switching between IE's tabs (bring up the html, switch to some
      other IE tab, switch back to the file).

      Any help/suggestion will be most appreciated!

      Ania.


      --- In ydn-javascript@yahoogroups.com, Dav Glass <dav.glass@...> wrote:
      >
      > Try this:
      >
      > var layout2 = new
      YAHOO.widget.Layout(layout.getUnitByPosition('center').get('wrap'), {

      > parent:layout,
      > width: layout.getSizes().center.w,
      > height: layout.getSizes().center.h,
      > units:[
      > { position: 'top', height:
      '320px',width:'930px',body:'top2'},
      > { position:
      'center',height:'200px',width:'930px',body:'center2'}
      > ]
      >
      > });
      >
      >
      >
      >
      > layout2.render();
      >
      > That should do it..
      >
      > Dav
      >
      > Dav Glass
      > dav.glass@...
      > blog.davglass.com
      >
      >
      >
      >
      > + Windows: n. - The most successful computer virus, ever. +
      > + A computer without a Microsoft operating system is like a dog
      > without bricks tied to its head +
      > + A Microsoft Certified Systems Engineer is to computing what a
      > McDonalds Certified Food Specialist is to fine cuisine +
      >
      >
      >
      > ----- Original Message ----
      > From: nihar bhatt <ntimesc@...>
      > To: ydn-javascript@yahoogroups.com
      > Sent: Thursday, July 3, 2008 1:38:37 AM
      > Subject: Re: [ydn-javascript] problem in displaying layout in IE
      >
      > please go to this url i have uploaded the site on freewebpage
      >
      > http://wbtltd.freewebpage.org/index.htm
      >
      > please try to open it in IE and also in FireFox
      >
      > Thanks Dav
      >
      >
      > On Thu, Jul 3, 2008 at 1:50 AM, Dav Glass <dav.glass@...> wrote:
      >
      > Nihar --
      >
      > Can you toss up a page with the issue? I can't replicate it from
      your provided code :)
      >
      > Thanks
      > Dav
      >
      > Dav Glass
      > dav.glass@...
      > blog.davglass.com
      >
      >
      >
      >
      > + Windows: n. - The most successful computer virus, ever. +
      > + A computer without a Microsoft operating system is like a dog
      > without bricks tied to its head +
      > + A Microsoft Certified Systems Engineer is to computing what a
      > McDonalds Certified Food Specialist is to fine cuisine +
      >
      >
      >
      >
      > ----- Original Message ----
      > From: nihar bhatt <ntimesc@...>
      > To: ydn-javascript@yahoogroups.com
      > Sent: Wednesday, July 2, 2008 10:46:45 AM
      > Subject: [ydn-javascript] problem in displaying layout in IE
      >
      > Hi people,
      >
      >
      > Problem:
      > I am using multiple layouts in my website. i have two
      javascript files
      >
      > 1) main.js in which one simple layout is
      created.
      > 2) tabview.js in which one more layout is
      created which is a child of a layout created in main.js.
      >
      > now when i am rendering second layout which is in
      tabview.js i am getting "invalid argument" error in IE but in firefox
      everything is going perfect.
      >
      >
      > here is code of default.html file
      >
      ---------------------------------------------------------------------------------
      > <html>
      > <body class="yui-skin-sam">
      > <div id="page" class="yui-t1 ">
      > <!-- top of the page -->
      > <div id="top1"> </div>
      >
      > <!-- center of the page -->
      > <div id="center1">
      > <div id="top2"><div id="tabviewone"></div></div>
      > <div id="center2"><div id="tabviewtwo"></div></div>
      > </div>
      >
      > </div>
      >
      > <!-- script for yui loder utility-->
      > <script type="text/javascript"
      src="../build/yuiloader/yuiloader-beta-min.js"></script>
      > <!-- script for main page-->
      > <script type="text/javascript" src="js/main.js"></script>
      > </body>
      > <html>
      >
      ----------------------------------------------------------------------------------
      >
      > main.js
      >
      >
      -------------------------------------------------------------------------------------
      > (function() {
      >
      > var loader = new YAHOO.util.YUILoader({
      > //Get these modules
      > base: '../build/',
      > require:['reset-fonts-grids', 'utilities', 'resize',
      'button','layout','tabview','imageloader','container','datatable','dragdrop','button','slider','selector'],
      > rollup: true,
      > onSuccess:function() {
      > YAHOO.util.Get.css('res/mainpage.css');
      > YAHOO.util.Event.onDOMReady(function(){
      > var Dom = YAHOO.util.Dom;
      >
      > layout = new YAHOO.widget.Layout('page',{
      > height:Dom.getClientHeight(),
      > width:930,
      > units: [
      > { position: 'top', height: '120px', body:
      'top1',width:930},
      > { position: 'center', body:
      'center1',width:930 }
      > ]
      > }); // End of Layout
      >
      >
      > layout.on('resize', function() {
      >
      > layout.set('height',Dom.getClientHeight());
      > });//End of resize
      >
      >
      > layout.on('render',function(){
      >
      >
      > window.setTimeout(function() {
      >
      > YAHOO.util.Get.script('js/data.js');

      > YAHOO.util.Get.script('js/tabview.js');

      >
      > }, 0);
      >
      > YAHOO.util.Dom.setStyle(document.body,
      'visibility', 'visible');
      >
      > setTimeout(function() {
      > layout.resize();
      > }, 1000);
      >
      > var elTop = document.getElementById('top1');
      > elTop.innerHTML='<img src="res/finalnew.png"/>';
      >
      >
      > });//End of Layout render
      >
      >
      > layout.render();
      >
      >
      > });// End of DOM
      >
      >
      > }// End of OnSuccess
      >
      >
      >
      > }); // End of loader
      >
      >
      > loader.insert();
      > })();
      >
      ------------------------------------------------------------------------------------
      >
      >
      > tabview.js
      >
      -------------------------------------------------------------------------------------
      > (function() {
      > var Event = YAHOO.util.Event;
      > var Dom = YAHOO.util.Dom;
      > var Sel = YAHOO.util.Selector;
      >
      >
      >
      >
      > var layout2 = new YAHOO.widget.Layout('center1', {

      > parent:layout,
      > width:'930px',
      > units:[
      > { position: 'top',
      height: '320px',width:'930px',body:'top2'},
      > { position:
      'center',height:'200px',width:'930px',body:'center2'}
      > ]
      >
      > });
      >
      > layout2.render();
      >
      >
      >
      > //Create a tabview
      > var tabViewOne = new YAHOO.widget.TabView();
      >
      > //Add tab one
      > tabViewOne.addTab( new YAHOO.widget.Tab({
      >
      > label:'Home',
      > content:'',
      > active: true,
      > id:'home'
      > }));
      >
      > //Add tab two
      > tabViewOne.addTab( new YAHOO.widget.Tab({
      >
      > label:'Products',
      > content:'',
      > id:'products'
      > }));
      >
      >
      > tabViewOne.addTab( new YAHOO.widget.Tab({
      >
      > label:'Technology',
      > content:'',
      > id:'technology'
      > }));
      >
      > tabViewOne.addTab( new YAHOO.widget.Tab({
      >
      > label:'Contact Us',
      > content:'',
      > id:'contactus'
      > }));
      >
      > tabViewOne.addTab( new YAHOO.widget.Tab({
      >
      > label:'Case Study',
      > content:'',
      > id:'casestudy'
      > }));
      >
      > tabViewOne.addTab( new YAHOO.widget.Tab({
      >
      > label:'Site Map',
      > content:'<div id="sitemaparea"><a href="#"
      id="homeclick">Home</a><br/><a href="#"
      id="prodclick">Product</a><br/><a href="#"
      id="techclick">Technology</a><br/><a href="#"
      id="contactclick">Contact Us</a></div>',
      > id:'sitemap'
      > }));
      >
      >
      >
      >
      > var elTop2 = Dom.get('tabviewone');
      > tabViewOne.appendTo(elTop2);
      >
      >
      > var setMap = function(e)
      > {
      > YAHOO.util.Event.preventDefault(e);
      >
      >
      > var elTarget =
      YAHOO.util.Event.getTarget(e);
      > while (elTarget.id != "sitemaparea") {
      >
      > //alert(elTarget.nodeName);
      > if(elTarget.id.toLowerCase() ==
      "homeclick") {
      >
      >
      tabViewOne.set('activeTab',tabViewOne.getTab(0));
      > break;
      > }
      > if(elTarget.id.toLowerCase() ==
      "prodclick")
      > {
      >
      tabViewOne.set('activeTab',tabViewOne.getTab(1));
      > break;
      >
      > }
      > if(elTarget.id.toLowerCase() ==
      "techclick")
      > {
      >
      tabViewOne.set('activeTab',tabViewOne.getTab(2));
      > break;
      >
      > }
      > if(elTarget.id.toLowerCase() ==
      "contactclick")
      > {
      >
      tabViewOne.set('activeTab',tabViewOne.getTab(3));
      > break;
      >
      > }
      > else
      > {elTarget =
      elTarget.parentNode;}
      > }
      >
      >
      > }
      >
      > Event.on("sitemaparea", "click",setMap);
      >
      >
      > var tabViewTwo = new YAHOO.widget.TabView();
      >
      > //Add tab one
      > tabViewTwo.addTab( new
      YAHOO.widget.Tab({
      >
      > label:'News & Event',
      > content:'<table><tr><td
      width="700px"><div id="newstable"></div></td><td valign="bottom"><div
      id="mypaginator"></div></td></tr></table>',
      > active: true,
      > id:'newsevent'
      > }));
      >
      > var elCenter2 = Dom.get('tabviewtwo');
      > tabViewTwo.appendTo(elCenter2);
      > }) (); // End
      >
      -------------------------------------------------------------------------------------
      >
    Your message has been successfully submitted and would be delivered to recipients shortly.