vrijdag 3 januari 2014

ADF: Putting IE in a certain document mode

Problem

In our ADF application we used some javascript to put the focus on the first field of an af:query component.  This seems to work great when running directly from JDeveloper, but doesn't if the application is deployed on a separate WLS.

Solution

First we thought it is the javascript itself, but this was not possible since we do not change the code.
One of our JSF experts, Rudy De Busscher, figured out that the compatibility mode of IE changed between both deployments.  How or why, remains still a mystery.

So, now we need to force IE to keep his IE8 compatibility mode.  To do this, you need to put a meta tag in the header of your page.  This is easy enough to do in ADF, in the af:document tag, add a facet with this tag in, like this:

<af:document id="d1" title="Test Javascript">
   <f:facet name="metaContainer">
      <f:verbatim>
         <meta http-equiv="x-ua-compatible" content="IE=8"/>
      </f:verbatim>
   </f:facet>
....

The problem with this solution is that the meta-tag will be put after your stylesheet tags, which will result in the fact that this meta-tag is not taken into account.
To solve this problem, you need to perform a small operation.  Since this seems to be a hack, I'm not sure it will work in all ADF versions.  I tested it with ADF 11.1.1.3.0.
Make your code look like the following:

<f:view>
   <f:verbatim>
      <head><meta http-equiv=x-uq-compatible" content="IE=8"/></head>
   </f:verbatim>
   <af:document id="d1" title="Test Javascript">
   ...
To check whether IE is taken this into account, use the F12 key to open the Developer Tools, in the top menu you will find the Document Mode.  This will indicate in which mode you are operating.  Also have a look at the header of the document, the meta-tag of http-equiv should be after the title, but proceeding the stylesheet tags.

Have Fun.

F.

Geen opmerkingen:

Een reactie posten