2 Replies Latest reply on Jul 21, 2011 2:08 PM by Mick Hunter

    Safari not liking <a4j:ajax/> control

    Mick Hunter Newbie

      In my application I am using JSF 2.0, OpenFaces 3.0, RichFaces 4.0, and jQuery 1.5.1.min. Tomcat 6.0.14

       

      I'm using jqModal to display a modal div window to the user to provide me with some data.  This jQuery plug-in displays a overlay over the back of the application to prevent clicking off of the modal window (nothing crazy).  When I do an Ajax call, I change the z-index of my modal window to push the modal window behind the overlay.  Once the Ajax call is made and completes, I reset the modal's z-index and the modal window is operative again. Basically when the <a4J:ajax/> control is fired, the onbeforesubmit="showOverlay();" works just fine.  But when the call is complete, the onbeforedomupdate="hideOverlay();" does not work.  Within Safari, when I right + click and select, "inspect element", I see that I'm getting a JavaScript error of "ReferenceError: Can't find variable: RichFaces".  This works fine in all other browsers except Safari.  I'm using the latest version, 5.0.5.

       

      The code is as follows:

       

      <h:selectOneMenu id="custClass"

           tabindex="0"

           value="#{beanReg.class}"

           required="true"

           style="width:235px; vertical-align: middle;">

          

           <f:selectItem itemValue="0"

                itemLabel="-- Select One --"/>

               

          <f:selectItems value="#{beanReg.classes}"/>

               <a4j:ajax render="mGroup"

                    listener="#{beanReg.classesChanged}"

                    onbeforesubmit="showOverlay();"

                    onbeforedomupdate="hideOverlay();"/>

      </h:selectOneMenu>

       

       

      JavaScript Code:

       

      var $j = jQuery.noConflict();

       

      function showOverlay() {

          $j('div#wizardDiv.jqmDialog').css('zIndex', 10);

      }

       

      function hideOverlay() {

          $j('div#wizardDiv.jqmDialog').css('zIndex', 3000);

      }

       

       

      Any help with this is much appreciated!!!

        • 1. Re: Safari not liking <a4j:ajax/> control
          Nick Belaevski Master

          Hi Mick,

           

          I've just checked showcase example for a4j:ajax - both demos work fine. Can you please check if it's reproducible for you?

          Also including additional jQuery version can cause script conflicts and various JS errors, try using jQuery that is bundled with RichFaces.

          • 2. Re: Safari not liking <a4j:ajax/> control
            Mick Hunter Newbie

            Hey Nick,

             

            Thanks for taking the time to look at this. 

             

            To answer you question, yes the RichFaces Showcase works for me as well.

             

            I'm trying to understand where a script conflict could exists where my use case works fine in all other browsers.  Also, in my local jQuery code, I've made the changes to prevent conflicts via the following code:

             

                 // Use jQuery via $j(...) due to the conflict between RichFaces Prototype.js libs.

                 var $j = jQuery.noConflict();

             

            So all of my jQuery calls are made via $j().  Also, (not 100% on this part).  But when I look at the source from the rendered page in the browser, the a4j:ajax calls are being rendered as the following:

             

            <a id=&quot;registerForm:j_idt11&quot; href=&quot;#&quot; onclick=&quot;RichFaces.ajax(this,event,{&quot;parameters&quot;:{&quot;javax.faces.behavior.event&quot;:&quot;action&quot;} ,&quot;sourceId&quot;:&quot;registerForm:j_idt11&quot;,&quot;begin&quot;:&quot;$j('.jqmDialog').jqmHide();&quot;} );return false&quot; class=&quot;jqmdX jqmClose&quot;>

                 <img src=&quot;/myNPP/javax.faces.resource/cancelSearch.gif.xhtml?ln=images&quot; style=&quot;border: 0 none;&quot;>

            </a>

             

            The error I'm getting in Safari is: 'ReferenceError: Can't find variable: RichFaces'.  So I don't know if it is having an issue with the 'RichFaces.ajax(this,event....) part or not.  It feels as if there is some library Safari didn't load or can't see.  Again, I'm not 100% nor do I know of any way of proving that. 

             

            Anyhow, I hope that information helps with a possible solution.  Any advice is much much appreciated.

             

            Thanks again!