8 Replies Latest reply on Aug 1, 2012 1:49 PM by Israel Rios

    Table sorting problem in Safari

    peter koebele Newbie

      Hello everyone.

       

      Apparently there is a problem when sorting a Richfaces datatable/column in Safari (5 or 4) on Mac with the sortBy attribute. The sorting fails as soon as the table contains a column of rich:calendar and/or rich:comboBox components - maybe other richfaces components are also don't work. After clicking on the sort icon, all table entries disappear. In that case the JavaScript console of Safari displays the following error message:

      NOT_SUPPORTED_ERR: DOM Exception 9: The implementation did not support the requested type of object or operation
      :8080/mcc/a4j/g/3_3_3.Finalorg.ajax4jsf.javascript.AjaxScript.jsf:121

       

      Is there any solution/workaround to fix this sorting problem? The problem does not occur with Safari 4 on a Windows machine.

      Below you can find a simple example, that fails in Safari on Mac.

       

      Best regards

      pkx

       

      <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>

      <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>

      <%@ taglib uri="http://richfaces.org/a4j" prefix="a4j" %>

      <%@ taglib uri="http://richfaces.org/rich" prefix="rich" %>

      <%@ taglib uri="http://chors.de/tld/chors" prefix="chors"%>

      <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

      <%@ page language="java" contentType="text/html; charset=ISO-8859-1"  pageEncoding="ISO-8859-1"%>

      <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

      <html>

      <head>

        <meta HTTP-EQUIV="Content-Type" CONTENT="text/html;charset=ISO-8859-1">

         <title> TestEntity Table</title>

      </head>

      <body>

      <f:view>

      <a4j:form id="TestEntityTableForm" >

      <rich:dataTable           id="TestEntityTable"  value="#{testBackingBean.allEntities}"

      var="entity" rows="20"   width="600px"

      sortMode="single"      >

      <rich:column sortBy="#{entity.stringValue}"   >

      <f:facet name="header"> <h:outputText value="String" /> </f:facet>

      <h:inputText value="#{entity.stringValue}"  />

      </rich:column>

       

      <rich:column sortBy="#{entity.dateValue}"  >

        <f:facet name="header"> <h:outputText value="Date" /> </f:facet>

      <rich:calendar value="#{entity.dateValue}"  />

       

      </rich:column>

      </rich:dataTable>

      </a4j:form>

      </f:view>

      </body>

      </html>

        • 1. Re: Table sorting problem in Safari
          Ilya Shaikovsky Master

          Please doublecheck that you have no old scripts cached from previous RF versions.

          https://jira.jboss.org/browse/RF-5630 seems were fixed and I can't actuallyreproduce under 3.3.3 also - But if you able to provide war sample which illustrates the problem - please comment and reopen.

          • 2. Re: Table sorting problem in Safari
            peter koebele Newbie

            Thanks for your reply.

            The problem still exists - using richfaces-3.3.3.FINAL and clearing the scripts. I will re-open the jira issue attaching a test war.

             

            Best regards

            Peter

            • 3. Re: Table sorting problem in Safari
              peter koebele Newbie

              Unfortunately I cannot access the JIRA - login with my jboss.org account fails. Therefore I attach the war file to this thread. You can deploy this war file in JBoss AS and access the test page with http://localhost:8080/mcc-test/testdatatable.jsf.

              Please keep in mind, that the sorting fails using the Safari browser on a Mac. Safari on a Windows machine works fine.

               

              Best regards

              Peter

              • 4. Re: Table sorting problem in Safari
                Ilya Shaikovsky Master

                added your case and reopened. thanks!

                • 5. Re: Table sorting problem in Safari
                  Javier Salas Newbie

                  Another workaround.

                   

                  You can also add a javaScript function to reRender the table,

                   

                  For example:

                   

                  <a4j:jsFunction name="reRenderTable" reRender="dtable" requestDelay="500"/>

                   

                  <rich:dataTable id="dtable" value="#{employeeBean.search}"
                                      var="employee onclick="reRenderTable();">

                  • 6. Re: Table sorting problem in Safari
                    peter koebele Newbie

                    Thanks for your reply. The approach using <a4j:jsFunction/> works.

                     

                    Best regards

                    Peter

                    • 7. Re: Table sorting problem in Safari
                      Balder Carrate Newbie

                      Still facing this issue in RF 3.3.3

                       

                      I think it would be better to add some constraints to the dataTable re-rendering. Im using rich:jQuery to refresh the dataTable whe user clics on table header. Something like:

                       

                      <h:form id="listDocumentoForm">

                      <rich:jQuery selector="table thead"

                                                              query="click(function(){

                                                                                            refreshListDocumentoFixWebkit();

                                                                                  })"/>

                       

                      <a4j:jsFunction

                        name="refreshListDocumentoFixWebkit"

                        reRender="listDocumentoForm"

                        ajaxSingle="true"

                        immediate="true"

                        limitToList="true"

                        requestDelay="1500" />

                       

                                          <rich:dataTable          id="listDocumento"

                                                              value="#{listDocumentoController.items}"

                                                              var="itemDocumento"

                                                              rowClasses="odd, even"

                                                              reRender="listDocumentoDataScroller">

                      </rich:dataTable>

                      </h:form>

                       

                      Best regards

                      • 8. Re: Table sorting problem in Safari
                        Israel Rios Newbie

                        Ok, It seems to be a problem with webkit implementation of document.importNode. To circumvent this problem you can use this little piece of javascript code on your template file:

                         

                                if( /webkit/.test( navigator.userAgent.toLowerCase() ) ){
                                     var _importNode = window.document.importNode;
                                     window.document.importNode = function(node, deep){
                                          try{
                                               return _importNode.apply(this, arguments);
                                          } catch(e) {
                                               if( e.code == DOMException.NOT_SUPPORTED_ERR ){
                                                    // clone and adopt
                                                    return document.adoptNode(node.cloneNode(deep));
                                               }
                                               throw e;
                                          }
                                     };
                                }