3 Replies Latest reply on Sep 13, 2007 9:01 PM by Dan Liu

    css is disabled in IE when a4j:poll is used

    Dan Liu Apprentice

      I use a4j:poll to send a request to my server every 30 seconds for checking new status. however, periodically(every 2-5 minutes), it would disable my css and my page become very ugly. I've been having this problem for a month now and still can't find a solution. This only happens in IE and everything works fine in firefox. I'm using a4j1.1.1+MyFaces1.5+Facelet+Seam.

        • 1. Re: css is disabled in IE when a4j:poll is used
          Sergey Smirnov Master

          do you have a small test application that you can shared with us?

          Those kind of problem hard to solve without reproducing them on our side.

          • 2. Re: css is disabled in IE when a4j:poll is used
            Dan Liu Apprentice

            Here is a simplified version:

            mypage.xhtml

            <!DOCTYPE composition 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"
             xmlns:ui="http://java.sun.com/jsf/facelets"
             xmlns:f="http://java.sun.com/jsf/core"
             xmlns:t="http://myfaces.apache.org/tomahawk"
             xmlns:h="http://java.sun.com/jsf/html"
             xmlns:a="https://ajax4jsf.dev.java.net/ajax">
            <ui:composition template="test_template.xhtml">
            
            <ui:define name="body">
            
            
            
             <a:outputPanel id="myStatusPanel" style="margin:0 auto">
             <h:outputText value="My Number:" />
             <h:outputText styleClass="STYLE1" value="#{myTestBean.myNumber}" />
            
             <h1><a class="ad" href="#">Hello<br />
             <span><p class="text_hint">Hello David,How are u</p></span></a>
             </h1>
             </a:outputPanel>
            
            </ui:define>
            
            </ui:composition>
            
            
            
            </html>
            



            test_template.xhtml
            <!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"
             xmlns:ui="http://java.sun.com/jsf/facelets"
             xmlns:h="http://java.sun.com/jsf/html"
             xmlns:f="http://java.sun.com/jsf/core"
             xmlns:a="https://ajax4jsf.dev.java.net/ajax">
            <head>
            <meta http-equiv="content-type" content="text/html; charset=GBK" />
            <link rel="stylesheet" type="text/css" href="test.css" />
            </head>
            
            <body >
            
            <div>
            
             <ui:insert name="body">
             </ui:insert>
            
            
            <ui:insert name="pullThread">
            <a:region renderRegionOnly="false">
            <h:form>
            <a:poll interval="5000" enabled="true" action="#{myTestBean.doAdd}" ajaxSingle="true" reRender="myStatusPanel" />
            </h:form>
            </a:region>
            </ui:insert>
            
            
            </div>
            </body>
            
            </html>
            
            


            test.css
            *{
            padding:5px;
            margin:5px;
            }
            
            body{
            text-align:center;
            font-size:20px;
            }
            
            .text_hint{
             border:1px solid #FF0000;
             border-top:none;
            }
            
            .ad{
             position:relative;
             float:left;
             padding:5px;
             border:1px dashed #FF0000;
             color:#FF0000;
             text-decoration:none;
            }
            
            .ad:hover {background:#fff;color:#ff0000; text-decoration:none;}
            .ad span{display: none; font-size:12px;}
            .ad:hover span{
            display:block;
            position:absolute;
             line-height:160%;
             padding:8px 0px;
             top:65px;
             left:-15px;
             width:130px;
             background:#FFF url(images/tip.gif) no-repeat top;
             border:none;
            color:#000;
            text-align:center;
            }
            
            .ad a{color:#FF0000; text-decoration:none;}
            


            MyBean is a seam component.
            @Name("myTestBean")
            @Scope(SESSION)
            public class MyBean {
            
             private int myNumber;
            
             public void doAdd(){
             myNumber++;
             }
             public int getMyNumber() {
             return myNumber;
             }
            
             public void setMyNumber(int myNumber) {
             this.myNumber = myNumber;
             }
            
            
            }
            
            


            As you can see, text "Hello David,How are u" should be hidden and it should show up when mouse move over the link. When I have a:poll in my page, this becomes a problem. Also, If you wait longer enough(sometimes 2 minutes, sometime 2 days), the css would be disable for the whole page. If the page is more complex, the problem would occurs more frequent(happens every 2-30 minutes) .

            • 3. Re: css is disabled in IE when a4j:poll is used
              Dan Liu Apprentice

              any progress? I'm hoping to get a solution here. Thanks.