myfaces-users mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From "Paul Klaer" <pkl...@infeurope.lu>
Subject Re: <f:verbatim> problem
Date Wed, 07 Dec 2005 23:48:16 GMT
Hi, see my comments at the bottom...

On Wed, 07 Dec 2005 23:46:42 +0100, hilz <hs_74@hotmail.com> wrote:

> gramani@intellicare.com wrote:
>>  news <news@sea.gmane.org> wrote on 12/07/2005 03:39:11 PM:
>>   >
>>  > Thanks for the answer Geeta....
>>  > Adding them in the <h:column> will show up in the html file, but it
>>  > won't give the results i want. the table looks weird if i do that...
>>  >
>>  > I think the style suggestion is the way to go, but...now this turned
>>  > into a style question!
>>  > I hope you can still help me with that!
>>  > so how do i specify the width of individual column in the style ?
>>  Here's an example from my jsp:
>>  <t:dataTable id="items" var="assignment"
>>                 value="#{assignmentList.assignments}"  
>> rowCountVar="rowsCount"
>>                 headerClass="searchTable_Header"  
>> footerClass="searchTable_Footer"
>>                  
>> columnClasses="searchTable_Column,searchTable_Column_Centered">
>>                 <h:column>
>>                         <f:facet name="header">
>>                                 <h:outputText value="Patient Name" />
>>                         </f:facet>
>>                         <h:outputText value="#{assignment.contactName}"  
>> />
>>                 </h:column>
>>                 <h:column>
>>                         <f:facet name="header">
>>                                 <h:outputText value="Activity/Call" />
>>                         </f:facet>
>>                         <h:outputText  
>> value="#{assignment.urlForDisplay}" />
>>                 </h:column>
>> </t:dataTable>
>>   My style sheet has:
>> .searchTable_Column_Centered {
>>         font-family : Arial, Helvetica, verdana, Geneva, sans-serif;
>>         font-size: 12px;
>>         background-color: #FFFFFF;
>>     color: #000000;
>>     padding: 2;
>>     text-align: center;
>>     border: none;
>>         }
>> .searchTable_Column {
>>         font-family : Arial, Helvetica, verdana, Geneva, sans-serif;
>>         font-size: 12px;
>>         font-weight: bold;
>>         background-color: #FFFFFF;
>>     color: #000000;
>>     padding: 2;
>>     text-align: left;
>>     border: none;
>>         }
>>  (You should be able to add something like width:760px above to get the  
>> width you want).
>>  And up top in my layout.jsp (I use tiles):
>>  <link rel="stylesheet"
>>                 href="<h:outputText  
>> value="#{facesContext.externalContext.requestContextPath}/style/basic.css"  
>> />" />
>>   Hth,
>> Geeta
>
>
> Geeta... thank you for your input one more time...
> After some investigation, it seems this is not acheivable using  
> stylesheets.
> see this:
>
> http://www.notestips.com/80256B3A007F2692/1/TAIO5WFG7K
>
> and more specifically the part where it says:
>
> "The problem is that this affects ALL cells, individual columns cannot  
> be targeted. The solution is not inherently CSS based but HTML based,  
> the way to solve this issue is by inserting the underused <colgroup> and  
> <col> tags into the table markup."
>
>
> So there is no way to control the column widths individually using the  
> css style...
> so we're back to square one... I have to do it using this approach:
>
>      <colgroup>
>          <col width="xxx">
>          <col width="xxx">
>      </colgroup>
>
> So now i need to figure out how to get this to appear in my html table.
> Any solution or work around is appreciated.
>
> thanks
>

I think he posted a good solution for your needs. As I understand you want  
to set the width for each column to a different size... right? I think the  
post before was correct:

columnClasses="searchTable_Column,searchTable_Column_Centered,  
,last_styleColumnPreviousHasNoStyle">

and now you set on each stylesheet class a different size:

.searchTable_Column{
width: 10px;
etc...
}
.searchTable_Column_Centered {
width: 100px;
etc...
}
.last_styleColumnPreviousHasNoStyle{
width: 20px;
etc...
}

This stylesheet and attribute columnClasses will render a table with  
following behaviour:

first column has the width: 10px
second column has the width: 100px
third coulmn has no stylesheet defined
last column has the width 20px

I'm using this approach in my templates for each dataColumn... This works  
fine in myfaces.

The article to which you are referring repects the "domino" software needs  
and shows a workaround for "domino" what has nothing to do with myfaces  
because myfaces supports style sheet definitions for each column in a  
table...

---------- snip -----------
.tableformat3 td{
padding:15px;
width:100px;
}

The problem is that this affects ALL cells, individual columns cannot be  
targeted. The solution is not inherently CSS based but HTML based, the way  
to solve this issue is by inserting the underused <colgroup> and <col>  
tags into the table markup.
---------- snip ----------

this is similar to the following myfaces column attribute definition:

columnClasses="searchTable_Column">

now all columns are rendered by size 10px because each column uses this  
one style sheet defined.

I hope this will help you understanding the myfaces columns style  
attribute. All comma seperated style definitions will be rendered for each  
individual coulumn and not for all columns.

Thats the same like you would write:

<colgroup>
   <col width="column1_Width_xxx">
   <col width="column2_Width_xxx">
</colgroup>

in myfaces ---> columnClasses="column1_StyleWidth_xxx,  
column2_StyleWidth_xxx"


Best Regards,

Paul

Mime
View raw message