1. #1
    Ext JS Premium Member
    Join Date
    Mar 2008
    Location
    Phoenix, AZ
    Posts
    631
    Vote Rating
    11
    zombeerose will become famous soon enough zombeerose will become famous soon enough

      0  

    Default DomHelper append stylesheet in IE

    Does anyone know what I'm doing wrong? This code works fine for FF but IE6 just won't load the stylesheet.

    Code:
    var head = document.getElementsByTagName('head')[0];
    Ext.DomHelper.append(head, {
     href: 'your_new_style.css'
     ,rel: 'stylesheet'
     ,tag: 'link'
     ,type: 'text/css'
     ,media: 'screen'
    });
    If I go old-school, it works in IE
    Code:
    var css = document.createElement('link');
    css.type = 'text/css';
    css.rel = 'stylesheet';
    css.href = 'your_new_style.css';
    css.media = 'screen';
    head.appendChild(css);

  2. #2
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    111
    Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of

      0  

    Default

    DomHelper defaults to inserting HTML, but you can only insert a script tag using DOM manipulation, e.g.
    Code:
    Ext.DomHelper.useDom = true;
    ps. Isn't it easier to use:
    Code:
    Ext.util.CSS.swapStyleSheet('my-id', 'your_new_style.css');
    (doesn't set the media type)

  3. #3
    Ext JS Premium Member
    Join Date
    Mar 2008
    Location
    Phoenix, AZ
    Posts
    631
    Vote Rating
    11
    zombeerose will become famous soon enough zombeerose will become famous soon enough

      0  

    Default

    I would normally use the CSS class but in this situation, I am trying to add a stylesheet to a document that is loaded in a managed iframe. That also begs the question of why isn't there an addStyleSheet method in the CSS class that adds a link to an existing file? You can create one from rules and delete a link but you can't add a link?

    I tried setting the useDom flag but it still won't work for IE.

  4. #4
    Sencha - Services Team hendricd's Avatar
    Join Date
    Aug 2007
    Location
    Long Island, NY USA
    Posts
    5,965
    Vote Rating
    12
    hendricd will become famous soon enough hendricd will become famous soon enough

      0  

    Thumbs up

    Quote Originally Posted by zombeerose View Post
    I would normally use the CSS class but in this situation, I am trying to add a stylesheet to a document that is loaded in a managed iframe. That also begs the question of why isn't there an addStyleSheet method in the CSS class that adds a link a document?

    I tried setting the useDom flag but it still won't work for IE.
    @zombeerose -- No, you can't use DomHelper to create elements (with useDom:true) in other documents (until a later MIF release) because the document context is 'locked in' to the document that loaded Ext.

    But, as Condor recommended earlier, MIF's CSS interface provides a similar method:

    Code:
    MIFP.getFrame().CSS.swapStyleSheet('someId', 'your_new_style.css');
    "be dom-ready..."
    Doug Hendricks

    Maintaining ux: ManagedIFrame, MIF2 (FAQ, Wiki), ux.Media/Flash, AudioEvents, ux.Chart[Fusion,OFC,amChart], ext-basex.js/$JIT, Documentation Site.


    Got Sencha licensing questions? Find out more here.


  5. #5
    Ext JS Premium Member
    Join Date
    Mar 2008
    Location
    Phoenix, AZ
    Posts
    631
    Vote Rating
    11
    zombeerose will become famous soon enough zombeerose will become famous soon enough

      0  

    Default

    I'll talk your word for it about the DomHelper. I'm still confused why then it works in FF but not IE.

    As far as CSS, I would love to use that class if there was an "add" method because I'm not swapping a sheet.

  6. #6
    Sencha - Services Team hendricd's Avatar
    Join Date
    Aug 2007
    Location
    Long Island, NY USA
    Posts
    5,965
    Vote Rating
    12
    hendricd will become famous soon enough hendricd will become famous soon enough

      0  

    Default

    Quote Originally Posted by zombeerose View Post
    I'll talk your word for it about the DomHelper. I'm still confused why then it works in FF but not IE.

    As far as CSS, I would love to use that class if there was an "add" method because I'm not swapping a sheet.
    The CSS.swapStyleSheet method simply removes an existing <link> tag (if it exists) and recreates a new one for you. It does what you're looking for.
    "be dom-ready..."
    Doug Hendricks

    Maintaining ux: ManagedIFrame, MIF2 (FAQ, Wiki), ux.Media/Flash, AudioEvents, ux.Chart[Fusion,OFC,amChart], ext-basex.js/$JIT, Documentation Site.


    Got Sencha licensing questions? Find out more here.


  7. #7
    Ext JS Premium Member
    Join Date
    Mar 2008
    Location
    Phoenix, AZ
    Posts
    631
    Vote Rating
    11
    zombeerose will become famous soon enough zombeerose will become famous soon enough

      0  

    Default

    Ah ha! It works in IE too - even better!!!

    You guys are awesome! Thanks!

Thread Participants: 2