You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@myfaces.apache.org by Enrique Medina <e....@gmail.com> on 2005/08/11 16:02:38 UTC
Rows highlighting
Hi,
Just a simple workaround until DataTable allows to do row highlighting:
<htm:style type="text/css">
<x:outputText
value="<!--
.tbl {
width: 100%;
border-collapse: collapse;
}
.tbl td {
text-align: center;
}
.tbl th {
text-align: left;
background-color: #ebeadb;
height: 20px;
}
.tbl .on {
background-color: #faf9f4;
}
.tbl .off {
background-color: #fff;
}
.tbl .hover {
background-color: #ffb164;
}
-->" />
</htm:style>
<htm:script>
<x:outputText
value="
<!--
var elem = 'TR';
window.onload = function(){
if(document.getElementsByTagName){
var el = document.getElementsByTagName(elem);
for(var i=0; i<el.length;
i++){
if(el[i].childNodes[0].tagName !='TH'
&& el[i].parentNode.parentNode.className.indexOf('tbl') !=-1){
if(i%2 == 1){
el[i].className='on'
;
el[i].onmouseout=function(){ this.className='on'
;
}
} else {
el[i].className='off'
;
el[i].onmouseout=function(){ this.className='off'
;
}
}
el[i].onmouseover=function(){
this.className='hover';
}
}
}
}
}
//-->" />
</htm:script>
Please note that I'm using the htmLib tag library ;-)
Then, simply add to your <x:dataTable> the attribute styleClass="tbl", and
it works like a charm!
Re: Rows highlighting
Posted by Sean Schofield <se...@gmail.com>.
> we shouldn't forget about the rowClasses attribute for simple things as
> well, though... you can stay with the standard for the simple stuff.
What I'm talking about cannot be handled with rowClasses correct?
> Martin
sean
Re: Rows highlighting
Posted by Martin Marinschek <ma...@gmail.com>.
yes, the rowIndex attribute is quite handy for such things.
we shouldn't forget about the rowClasses attribute for simple things as
well, though... you can stay with the standard for the simple stuff.
regards,
Martin
On 8/11/05, Sean Schofield <se...@gmail.com> wrote:
>
> Nice! I hadn't thought of that.
>
> BTW, I'm going to add a JIRA issue on a new t:dataTable attribute:
> rowId. This will allow you to use EL to determine the id of the <TR>
> element. This will be helpful right?
>
> sean
>
>
>
> On 8/11/05, Martin Marinschek <ma...@gmail.com> wrote:
> > you need to get to the rowIndex attribute like this:
> >
> > <x:dataTable styleClass="mainTable"
> > var="auctionHolder"
> > value="#{currentAuctionList.auctionList}"
> > preserveDataModel="true"
> > rowIndexVar="rowIdx"
> > cellspacing="5">
> >
> > and then do this in the column:
> >
> > <x:column styleClass="#{rowIdx%2==0?'oddRow':'evenRow'}">
> >
> > regards,
> >
> > Martin
> >
> > On 8/11/05, Enrique Medina <e....@gmail.com> wrote:
> > > I'm currently subscribed, so it's my fault...
> > >
> > > However, from my Javascript solution I could use different colors for
> odd
> > and even rows...
> > >
> > > How can I do this with the new DataTable?
> > >
> > >
> > > 2005/8/11, Sean Schofield < sean.schofield@gmail.com>:
> > >
> > > > Make sure to subscribe to the dev list and follow all of the JIRA
> > > > traffic there if you want to be ontop of the latest and greatest.
> > > > <t:dataTable> and related components like t:columns are changing
> > > > almost daily (for the better.)
> > > >
> > > > For this feature see:
> > > >
> > > > http://issues.apache.org/jira/browse/MYFACES-175
> > > >
> > > > See also:
> > > >
> > > > http://issues.apache.org/jira/browse/MYFACES-343
> > > >
> > > > sean
> > > >
> > >
> > >
> >
> >
>
Re: Rows highlighting
Posted by Sean Schofield <se...@gmail.com>.
Javascript baby :-)
When you click on a row and you need to do something in javascript you
often need info that uniquely identifies a choice.
Ex. A wizard where user can enter a new value or pick one from a
table. User clicks (or doubleclicks an entry in the table.) You want
to move on to the next step but you need to post the user's choice.
sean
On 8/11/05, Martin Marinschek <ma...@gmail.com> wrote:
> what do you need that for?
>
> just curious?
>
> regards,
>
> martin
>
>
>
> On 8/11/05, Sean Schofield <se...@gmail.com> wrote:
> > Nice! I hadn't thought of that.
> >
> > BTW, I'm going to add a JIRA issue on a new t:dataTable attribute:
> > rowId. This will allow you to use EL to determine the id of the <TR>
> > element. This will be helpful right?
> >
> > sean
> >
> >
> >
> > On 8/11/05, Martin Marinschek <ma...@gmail.com> wrote:
> > > you need to get to the rowIndex attribute like this:
> > >
> > > <x:dataTable styleClass="mainTable"
> > > var="auctionHolder"
> > > value="#{currentAuctionList.auctionList}"
> > > preserveDataModel="true"
> > > rowIndexVar="rowIdx"
> > > cellspacing="5">
> > >
> > > and then do this in the column:
> > >
> > > <x:column
> styleClass="#{rowIdx%2==0?'oddRow':'evenRow'}">
> > >
> > > regards,
> > >
> > > Martin
> > >
> > > On 8/11/05, Enrique Medina <e....@gmail.com> wrote:
> > > > I'm currently subscribed, so it's my fault...
> > > >
> > > > However, from my Javascript solution I could use different colors for
> odd
> > > and even rows...
> > > >
> > > > How can I do this with the new DataTable?
> > > >
> > > >
> > > > 2005/8/11, Sean Schofield < sean.schofield@gmail.com >:
> > > >
> > > > > Make sure to subscribe to the dev list and follow all of the JIRA
> > > > > traffic there if you want to be ontop of the latest and greatest.
> > > > > <t:dataTable> and related components like t:columns are changing
> > > > > almost daily (for the better.)
> > > > >
> > > > > For this feature see:
> > > > >
> > > > > http://issues.apache.org/jira/browse/MYFACES-175
> > > > >
> > > > > See also:
> > > > >
> > > > > http://issues.apache.org/jira/browse/MYFACES-343
> > > > >
> > > > > sean
> > > > >
> > > >
> > > >
> > >
> > >
> >
>
>
Re: Rows highlighting
Posted by Martin Marinschek <ma...@gmail.com>.
what do you need that for?
just curious?
regards,
martin
On 8/11/05, Sean Schofield <se...@gmail.com> wrote:
>
> Nice! I hadn't thought of that.
>
> BTW, I'm going to add a JIRA issue on a new t:dataTable attribute:
> rowId. This will allow you to use EL to determine the id of the <TR>
> element. This will be helpful right?
>
> sean
>
>
>
> On 8/11/05, Martin Marinschek <ma...@gmail.com> wrote:
> > you need to get to the rowIndex attribute like this:
> >
> > <x:dataTable styleClass="mainTable"
> > var="auctionHolder"
> > value="#{currentAuctionList.auctionList}"
> > preserveDataModel="true"
> > rowIndexVar="rowIdx"
> > cellspacing="5">
> >
> > and then do this in the column:
> >
> > <x:column styleClass="#{rowIdx%2==0?'oddRow':'evenRow'}">
> >
> > regards,
> >
> > Martin
> >
> > On 8/11/05, Enrique Medina <e....@gmail.com> wrote:
> > > I'm currently subscribed, so it's my fault...
> > >
> > > However, from my Javascript solution I could use different colors for
> odd
> > and even rows...
> > >
> > > How can I do this with the new DataTable?
> > >
> > >
> > > 2005/8/11, Sean Schofield < sean.schofield@gmail.com>:
> > >
> > > > Make sure to subscribe to the dev list and follow all of the JIRA
> > > > traffic there if you want to be ontop of the latest and greatest.
> > > > <t:dataTable> and related components like t:columns are changing
> > > > almost daily (for the better.)
> > > >
> > > > For this feature see:
> > > >
> > > > http://issues.apache.org/jira/browse/MYFACES-175
> > > >
> > > > See also:
> > > >
> > > > http://issues.apache.org/jira/browse/MYFACES-343
> > > >
> > > > sean
> > > >
> > >
> > >
> >
> >
>
Re: Rows highlighting
Posted by Sean Schofield <se...@gmail.com>.
Nice! I hadn't thought of that.
BTW, I'm going to add a JIRA issue on a new t:dataTable attribute:
rowId. This will allow you to use EL to determine the id of the <TR>
element. This will be helpful right?
sean
On 8/11/05, Martin Marinschek <ma...@gmail.com> wrote:
> you need to get to the rowIndex attribute like this:
>
> <x:dataTable styleClass="mainTable"
> var="auctionHolder"
> value="#{currentAuctionList.auctionList}"
> preserveDataModel="true"
> rowIndexVar="rowIdx"
> cellspacing="5">
>
> and then do this in the column:
>
> <x:column styleClass="#{rowIdx%2==0?'oddRow':'evenRow'}">
>
> regards,
>
> Martin
>
> On 8/11/05, Enrique Medina <e....@gmail.com> wrote:
> > I'm currently subscribed, so it's my fault...
> >
> > However, from my Javascript solution I could use different colors for odd
> and even rows...
> >
> > How can I do this with the new DataTable?
> >
> >
> > 2005/8/11, Sean Schofield < sean.schofield@gmail.com>:
> >
> > > Make sure to subscribe to the dev list and follow all of the JIRA
> > > traffic there if you want to be ontop of the latest and greatest.
> > > <t:dataTable> and related components like t:columns are changing
> > > almost daily (for the better.)
> > >
> > > For this feature see:
> > >
> > > http://issues.apache.org/jira/browse/MYFACES-175
> > >
> > > See also:
> > >
> > > http://issues.apache.org/jira/browse/MYFACES-343
> > >
> > > sean
> > >
> >
> >
>
>
Re: Rows highlighting
Posted by Martin Marinschek <ma...@gmail.com>.
you need to get to the rowIndex attribute like this:
<x:dataTable styleClass="mainTable"
var="auctionHolder"
value="#{currentAuctionList.auctionList}"
preserveDataModel="true"
rowIndexVar="rowIdx"
cellspacing="5">
and then do this in the column:
<x:column styleClass="#{rowIdx%2==0?'oddRow':'evenRow'}">
regards,
Martin
On 8/11/05, Enrique Medina <e....@gmail.com> wrote:
>
> I'm currently subscribed, so it's my fault...
>
> However, from my Javascript solution I could use different colors for odd
> and even rows...
>
> How can I do this with the new DataTable?
>
> 2005/8/11, Sean Schofield <se...@gmail.com>:
> >
> > Make sure to subscribe to the dev list and follow all of the JIRA
> > traffic there if you want to be ontop of the latest and greatest.
> > <t:dataTable> and related components like t:columns are changing
> > almost daily (for the better.)
> >
> > For this feature see:
> >
> > http://issues.apache.org/jira/browse/MYFACES-175
> >
> > See also:
> >
> > http://issues.apache.org/jira/browse/MYFACES-343
> >
> > sean
> >
>
>
Re: Rows highlighting
Posted by Enrique Medina <e....@gmail.com>.
I'm currently subscribed, so it's my fault...
However, from my Javascript solution I could use different colors for odd
and even rows...
How can I do this with the new DataTable?
2005/8/11, Sean Schofield <se...@gmail.com>:
>
> Make sure to subscribe to the dev list and follow all of the JIRA
> traffic there if you want to be ontop of the latest and greatest.
> <t:dataTable> and related components like t:columns are changing
> almost daily (for the better.)
>
> For this feature see:
>
> http://issues.apache.org/jira/browse/MYFACES-175
>
> See also:
>
> http://issues.apache.org/jira/browse/MYFACES-343
>
> sean
>
Re: Rows highlighting
Posted by Sean Schofield <se...@gmail.com>.
Make sure to subscribe to the dev list and follow all of the JIRA
traffic there if you want to be ontop of the latest and greatest.
<t:dataTable> and related components like t:columns are changing
almost daily (for the better.)
For this feature see:
http://issues.apache.org/jira/browse/MYFACES-175
See also:
http://issues.apache.org/jira/browse/MYFACES-343
sean
Re: Rows highlighting
Posted by Enrique Medina <e....@gmail.com>.
Ups, from when? I usually read all the posts here in a dayly basis and don't
remember it, but nice!
I'll download the nightly build right now :-)
2005/8/11, Sean Schofield <se...@gmail.com>:
>
> t:dataTable already allows row highlighting. See the simple examples
> in the latest nightly.
>
> sean
>
>
> On 8/11/05, Enrique Medina <e....@gmail.com> wrote:
> > Hi,
> >
> > Just a simple workaround until DataTable allows to do row highlighting:
> >
> > <htm:style type="text/css">
> > <x:outputText
> > value="<!--
> > .tbl {
> > width: 100%;
> > border-collapse: collapse;
> > }
> > .tbl td {
> > text-align: center;
> > }
> > .tbl th {
> > text-align: left;
> > background-color: #ebeadb;
> > height: 20px;
> > }
> > .tbl .on {
> > background-color: #faf9f4;
> > }
> > .tbl .off {
> > background-color: #fff;
> > }
> > .tbl .hover {
> > background-color: #ffb164;
> > }
> > -->" />
> > </htm:style>
> >
> > <htm:script>
> > <x:outputText
> > value="
> > <!--
> > var elem = 'TR';
> >
> > window.onload = function(){
> > if(document.getElementsByTagName){
> > var el = document.getElementsByTagName(elem);
> > for(var i=0; i<el.length;
> > i++){
> > if(el[i].childNodes[0].tagName !='TH'
> > &&
> > el[i].parentNode.parentNode.className.indexOf('tbl') !=-1){
> > if(i%2 == 1){
> > el[i].className='on'
> > ;
> > el[i].onmouseout=function(){ this.className='on'
> > ;
> > }
> > } else {
> > el[i].className='off'
> > ;
> > el[i].onmouseout=function(){ this.className='off'
> > ;
> > }
> > }
> > el[i].onmouseover=function(){
> > this.className='hover';
> > }
> > }
> > }
> > }
> > }
> > //-->" />
> >
> > </htm:script>
> >
> > Please note that I'm using the htmLib tag library ;-)
> >
> > Then, simply add to your <x:dataTable> the attribute styleClass="tbl",
> and
> > it works like a charm!
> >
> >
>
Re: Rows highlighting
Posted by Sean Schofield <se...@gmail.com>.
t:dataTable already allows row highlighting. See the simple examples
in the latest nightly.
sean
On 8/11/05, Enrique Medina <e....@gmail.com> wrote:
> Hi,
>
> Just a simple workaround until DataTable allows to do row highlighting:
>
> <htm:style type="text/css">
> <x:outputText
> value="<!--
> .tbl {
> width: 100%;
> border-collapse: collapse;
> }
> .tbl td {
> text-align: center;
> }
> .tbl th {
> text-align: left;
> background-color: #ebeadb;
> height: 20px;
> }
> .tbl .on {
> background-color: #faf9f4;
> }
> .tbl .off {
> background-color: #fff;
> }
> .tbl .hover {
> background-color: #ffb164;
> }
> -->" />
> </htm:style>
>
> <htm:script>
> <x:outputText
> value="
> <!--
> var elem = 'TR';
>
> window.onload = function(){
> if(document.getElementsByTagName){
> var el = document.getElementsByTagName(elem);
> for(var i=0; i<el.length;
> i++){
> if(el[i].childNodes[0].tagName !='TH'
> &&
> el[i].parentNode.parentNode.className.indexOf('tbl') !=-1){
> if(i%2 == 1){
> el[i].className='on'
> ;
> el[i].onmouseout=function(){ this.className='on'
> ;
> }
> } else {
> el[i].className='off'
> ;
> el[i].onmouseout=function(){ this.className='off'
> ;
> }
> }
> el[i].onmouseover=function(){
> this.className='hover';
> }
> }
> }
> }
> }
> //-->" />
>
> </htm:script>
>
> Please note that I'm using the htmLib tag library ;-)
>
> Then, simply add to your <x:dataTable> the attribute styleClass="tbl", and
> it works like a charm!
>
>