5:04 a.m.
Author: bleathem
Date: 2013-07-18 23:04:33 -0400 (Thu, 18 Jul 2013)
New Revision: 23265
Modified:
branches/enterprise/3.3.1.SP3_test_patch/samples/richfaces-demo/src/main/webapp/WEB-INF/web.xml
branches/enterprise/3.3.1.SP3_test_patch/samples/richfaces-demo/src/main/webapp/richfaces/scrollableDataTable/examples/scrollableDataTable_rf1107.xhtml
branches/enterprise/3.3.1.SP3_test_patch/ui/scrollableDataTable/src/main/javascript/ClientUI/controls/grid/GridBody.js
Log:
RF-1107: Fixed tabbing in scrollableDataTable header cells
Modified:
branches/enterprise/3.3.1.SP3_test_patch/samples/richfaces-demo/src/main/webapp/WEB-INF/web.xml
===================================================================
---
branches/enterprise/3.3.1.SP3_test_patch/samples/richfaces-demo/src/main/webapp/WEB-INF/web.xml 2013-07-18
19:51:47 UTC (rev 23264)
+++
branches/enterprise/3.3.1.SP3_test_patch/samples/richfaces-demo/src/main/webapp/WEB-INF/web.xml 2013-07-19
03:04:33 UTC (rev 23265)
@@ -38,11 +38,11 @@
</context-param>
<context-param>
<param-name>org.ajax4jsf.COMPRESS_SCRIPT</param-name>
- <param-value>true</param-value>
+ <param-value>false</param-value>
</context-param>
<context-param>
<param-name>org.ajax4jsf.COMPRESS_STYLE</param-name>
- <param-value>true</param-value>
+ <param-value>false</param-value>
</context-param>
<context-param>
<param-name>org.ajax4jsf.xmlparser.ORDER</param-name>
@@ -58,11 +58,11 @@
</context-param>
<context-param>
<param-name>org.richfaces.LoadStyleStrategy</param-name>
- <param-value>ALL</param-value>
+ <param-value>DEFAULT</param-value>
</context-param>
<context-param>
<param-name>org.richfaces.LoadScriptStrategy</param-name>
- <param-value>ALL</param-value>
+ <param-value>DEFAULT</param-value>
</context-param>
<listener>
Modified:
branches/enterprise/3.3.1.SP3_test_patch/samples/richfaces-demo/src/main/webapp/richfaces/scrollableDataTable/examples/scrollableDataTable_rf1107.xhtml
===================================================================
---
branches/enterprise/3.3.1.SP3_test_patch/samples/richfaces-demo/src/main/webapp/richfaces/scrollableDataTable/examples/scrollableDataTable_rf1107.xhtml 2013-07-18
19:51:47 UTC (rev 23264)
+++
branches/enterprise/3.3.1.SP3_test_patch/samples/richfaces-demo/src/main/webapp/richfaces/scrollableDataTable/examples/scrollableDataTable_rf1107.xhtml 2013-07-19
03:04:33 UTC (rev 23265)
@@ -1,34 +1,43 @@
-<ui:composition xmlns="http://www.w3.org/1999/xhtml"
+<!DOCTYPE html>
+<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:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich">
- <style>
- .scrolls{
- width:300px;
- height:200px;
- overflow:auto;
- }
- </style>
- <h:form>
+ <head>
+ <meta http-equiv="Content-Type" content="text/xhtml;
charset=UTF-8"/>
+ <meta http-equiv="x-ua-compatible" content="IE=8"/>
+ <title>
+ <ui:insert name="title"/>
+ </title>
+ <style type="text/css">
+ .scrolls{
+ width:300px;
+ height:200px;
+ overflow:auto;
+ }
+ </style>
+ </head>
+ <body>
+ <h:form>
<rich:spacer height="30" />
<rich:scrollableDataTable rowKeyVar="rkv" frozenColCount="1"
height="400px"
width="400px" id="carList" rows="40"
columnClasses="col"
value="#{dataTableScrollerBean.allCars}" var="category"
sortMode="single"
binding="#{dataTableScrollerBean.table}"
- sortOrder="#{dataTableScrollerBean.order}"
+ sortOrder="#{dataTableScrollerBean.order}"
selection="#{dataTableScrollerBean.selection}">
<rich:column id="make">
- <f:facet name="header"><h:outputText
styleClass="headerText" value="Make" /></f:facet>
+ <f:facet name="header"><h:outputText
styleClass="headerText" value="Make" /><h:inputText
value="" size="4" /></f:facet>
<h:outputText value="#{category.make}" />
</rich:column>
<rich:column id="model">
- <f:facet name="header"><h:outputText
styleClass="headerText" value="Model" /><h:inputText
value=""/></f:facet>
+ <f:facet name="header"><h:outputText
styleClass="headerText" value="Model" /><h:inputText
value="" size="4"/></f:facet>
<h:outputText value="#{category.model}" />
- <h:inputText value=""/>
+ <h:inputText value="" size="4"/>
</rich:column>
<rich:column id="price">
<f:facet name="header"><h:outputText
styleClass="headerText" value="Price" /></f:facet>
@@ -43,46 +52,47 @@
<h:outputText value="#{category.vin}" />
</rich:column>
<rich:column id="stock">
- <f:facet name="header"><h:outputText
styleClass="headerText" value="Stock" /><h:inputText
value=""/></f:facet>
+ <f:facet name="header"><h:outputText
styleClass="headerText" value="Stock" /><h:inputText
value="" size="4"/></f:facet>
<h:outputText value="#{category.stock}" />
- <h:inputText value=""/>
+ <h:inputText value="" size="4"/>
</rich:column>
- </rich:scrollableDataTable>
- <rich:spacer height="20px"/>
- <a4j:commandButton value="Show Current Selection"
reRender="table"
- action="#{dataTableScrollerBean.takeSelection}"
- oncomplete="javascript:Richfaces.showModalPanel('panel');"/>
+ </rich:scrollableDataTable>
+ <rich:spacer height="20px"/>
+ <a4j:commandButton value="Show Current Selection"
reRender="table"
+ action="#{dataTableScrollerBean.takeSelection}"
+ oncomplete="javascript:Richfaces.showModalPanel('panel');"/>
</h:form>
- <rich:modalPanel id="panel" autosized="false"
keepVisualState="false" width="315" height="230">
- <f:facet name="header">
- <h:outputText value="Selected Rows"/>
- </f:facet>
- <f:facet name="controls">
- <span style="cursor:pointer"
onclick="javascript:Richfaces.hideModalPanel('panel')">X</span>
- </f:facet>
+ <rich:modalPanel id="panel" autosized="false"
keepVisualState="false" width="315" height="230">
+ <f:facet name="header">
+ <h:outputText value="Selected Rows"/>
+ </f:facet>
+ <f:facet name="controls">
+ <span style="cursor:pointer"
onclick="javascript:Richfaces.hideModalPanel('panel')">X</span>
+ </f:facet>
<h:panelGroup layout="block" styleClass="scrolls">
- <rich:dataTable value="#{dataTableScrollerBean.selectedCars}"
var="sel" id="table">
- <rich:column>
- <f:facet name="header"><h:outputText value="Make"
/></f:facet>
- <h:outputText value="#{sel.make}" />
- </rich:column>
- <rich:column id="model">
- <f:facet name="header"><h:outputText value="Model"
/></f:facet>
- <h:inputText value=""/>
- </rich:column>
- <rich:column id="price">
- <f:facet name="header"><h:outputText value="Price"
/></f:facet>
- <h:outputText value="#{sel.price}" />
- </rich:column>
- <rich:column id="mileage">
- <f:facet name="header"><h:outputText value="Mileage"
/></f:facet>
- <h:outputText value="#{sel.mileage}" />
- </rich:column>
- <rich:column id="stock">
- <f:facet name="header"><h:outputText value="Stock"
/></f:facet>
- <h:inputText value=""/>
- </rich:column>
+ <rich:dataTable value="#{dataTableScrollerBean.selectedCars}"
var="sel" id="table">
+ <rich:column>
+ <f:facet name="header"><h:outputText value="Make"
/></f:facet>
+ <h:outputText value="#{sel.make}" />
+ </rich:column>
+ <rich:column id="model">
+ <f:facet name="header"><h:outputText value="Model"
/></f:facet>
+ <h:inputText value="" size="4"/>
+ </rich:column>
+ <rich:column id="price">
+ <f:facet name="header"><h:outputText value="Price"
/></f:facet>
+ <h:outputText value="#{sel.price}" />
+ </rich:column>
+ <rich:column id="mileage">
+ <f:facet name="header"><h:outputText value="Mileage"
/></f:facet>
+ <h:outputText value="#{sel.mileage}" />
+ </rich:column>
+ <rich:column id="stock">
+ <f:facet name="header"><h:outputText value="Stock"
/></f:facet>
+ <h:inputText value="" size="4"/>
+ </rich:column>
</rich:dataTable>
- </h:panelGroup>
+ </h:panelGroup>
</rich:modalPanel>
-</ui:composition>
+</body>
+ </html>
\ No newline at end of file
Modified:
branches/enterprise/3.3.1.SP3_test_patch/ui/scrollableDataTable/src/main/javascript/ClientUI/controls/grid/GridBody.js
===================================================================
---
branches/enterprise/3.3.1.SP3_test_patch/ui/scrollableDataTable/src/main/javascript/ClientUI/controls/grid/GridBody.js 2013-07-18
19:51:47 UTC (rev 23264)
+++
branches/enterprise/3.3.1.SP3_test_patch/ui/scrollableDataTable/src/main/javascript/ClientUI/controls/grid/GridBody.js 2013-07-19
03:04:33 UTC (rev 23265)
@@ -101,8 +101,13 @@
Event.observe(this.frozenContentBox.getElement(), "keyup",
this.synchronizeKeyUp.bindAsEventListener(this));
Event.observe(this.frozenContentBox.getElement(), "keydown",
this.synchronizeKeyDown.bindAsEventListener(this));
Event.observe(this.frozenContentBox.getElement(), "scroll",
this.synchronizeScroll.bindAsEventListener(this));
+
+ var gridHeader = this.grid.getHeader();
+ Event.observe(gridHeader.contentBox.getElement(), "keyup",
this.synchronizeHeaderKeyUp.bindAsEventListener(gridHeader));
+ Event.observe(gridHeader.contentBox.getElement(), "keydown",
this.synchronizeKeyDown.bindAsEventListener(gridHeader));
+ Event.observe(gridHeader.frozenContentBox.getElement(), "keyup",
this.synchronizeHeaderKeyUp.bindAsEventListener(gridHeader));
+ Event.observe(gridHeader.frozenContentBox.getElement(), "keydown",
this.synchronizeKeyDown.bindAsEventListener(gridHeader));
-
this.helpObject1 = new ClientUI.common.box.Box(this.gridId + ":nho",
this.contentBox.getElement());
this.helpObject2 = new ClientUI.common.box.Box(this.gridId + ":fho",
this.frozenContentBox.getElement());
@@ -686,8 +691,11 @@
},
synchronizeKeyUp: function (event) {
- if (Event.KEY_TAB == event.keyCode || Event.KEY_TAB == event.charCode) {
- var k = 0;
+ if (Event.KEY_TAB == event.keyCode || Event.KEY_TAB == event.charCode) {
+ if (ClientUILib.isIE7 || ClientUILib.isIE8) {
+ this.grid.getBody().frozenContentBox.element.scrollTop =
this.grid.getBody().contentBox.element.scrollTop;
+ }
+ var k = 0;
var el = document.activeElement;
if (el) {
k += el.offsetLeft;
@@ -705,7 +713,27 @@
}
}
}
- }
+ },
+
+ synchronizeHeaderKeyUp: function (event) {
+ if (Event.KEY_TAB == event.keyCode || Event.KEY_TAB == event.charCode) {
+ var k = 0;
+ var el = document.activeElement;
+ if (el) {
+ k += el.offsetLeft;
+ while (el.parentElement.id.indexOf("NormalBox")<0) {
+ el = el.parentElement;
+ k += el.offsetLeft;
+ if (el.parentElement.id.indexOf("FrozenBox")>=0) {
+ k = 0;
+ this.grid.getBody().scrollBox.element.scrollLeft = 0;
+ return;
+ }
+ }
+ this.grid.getBody().scrollBox.element.scrollLeft = k;
+ }
+ }
+ }
});
Object.extend(ClientUI.controls.grid.GridBody.prototype, {