You are viewing a plain text version of this content. The canonical link for it is here.
Posted to user@shale.apache.org by "Zheng, Xiahong" <Xi...@FMR.COM> on 2008/04/10 20:22:09 UTC
FW: [Shale Clay]
I couldn't seem to understand by looking at the clay usecase example.
Can somebody post a simple example of using clay to generate a dynamic
data table, the equivalent of the JSF h:dataTable tag?
RE: [Shale Clay]
Posted by Richard Eggert <re...@proteus-technologies.com>.
I don't see anything wrong with what you've written there (I would add type="file" to your <input> tag so that it looks right if you view it offline in a browser, but that shouldn't affect how Clay treats it). Does it let you select a file before submitting?
Double-check to make sure that you don't have any mistakes in your configuration (especially in web.xml). Check the log for errors as well (you may need to tweak the log settings to get useful information). I've used t:inputFileUpload with Clay many times, so I'm sure it works.
By the way, it generally isn't necessary to copy the component definitions into your clay-config.xml file. Just add classpath*:META-INF/tomahawk-1_1_3-config.xml to the org.apache.shale.clay.COMMON_CONFIG_FILES context parameter in your web.xml file, and you'll get the definitions of all the Tomahawk components.
Rich Eggert
Member of Technical Staff
Proteus Technologies, LLC
http://www.proteus-technologies.com
-----Original Message-----
From: Zheng, Xiahong [mailto:Xiahong.Zheng@FMR.COM]
Sent: Fri 4/11/2008 12:19 PM
To: user@shale.apache.org
Subject: RE: [Shale Clay]
Thanks again. I have another question. How does shale work with
fileload? I am trying to use t:fileUpload from tomahawk. I copied the
component definition into my clay-config.xml
<component jsfid="t:inputFileUpload"
componentType="org.apache.myfaces.HtmlInputFileUpload"
extends="baseOutput>
<attributes>
<set name="id" bindingType="VB" />
.....
</attributes>
</component>
And I added the following in my html form
<form enctype="multipart/form-data">
<input jsfid="t:inputFileUpload" value="#{mybean.symbolsFile}"
storage="file" />
<input type="submit" action="#{mybean.getQuotes}" value="Get Quotes"/>
</form>
When I hit the submit button, action method is never invoked.
Interestingly, if I remove the "enctype" attribute, action method is
indeed invoked but the input is null which is expected. I have the
extension filter configured.
Any idea?
-----Original Message-----
From: Richard Eggert [mailto:reggert@proteus-technologies.com]
Sent: Friday, April 11, 2008 7:33 AM
To: user@shale.apache.org
Subject: RE: [Shale Clay]
Yes. Basically, you would have to define a component that inherits from
h:dataTable, and give it child elements that inherit from h:column.
Each of those child elements would then contain children that make up
the content of your columns.
Rich Eggert
Member of Technical Staff
Proteus Technologies, LLC
http://www.proteus-technologies.com
-----Original Message-----
From: Zheng, Xiahong [mailto:Xiahong.Zheng@FMR.COM]
Sent: Fri 4/11/2008 12:08 AM
To: user@shale.apache.org
Subject: RE: [Shale Clay]
Thanks a lot Rich. I was able to use your first example without having
any white space issue even if I reformatted it a bit. If I want to use
the second solution, how would I define the behavior of the dataTable?
Would it still need to inherit dataTable for the looping capability
since the number of rows are dynamic?
-----Original Message-----
From: Richard Eggert [mailto:reggert@proteus-technologies.com]
Sent: Thursday, April 10, 2008 5:12 PM
To: user@shale.apache.org
Subject: RE: [Shale Clay]
My experience with dataTables and clay has been that they don't get
along very well, at least in the case of HTML templates (XML templates
are another story). This is mainly because h:dataTable has a
drastically different structure from HTML tables. h:dataTable expects
to have h:columns as its immediate child (with optional tags for header
and footer rows nested within each column), whereas HTML TABLE tags
expect to have TR (row) tags as its children (or TR tags nested within a
TBODY), with the column (TD) tags nested within each row. Essentially,
from the point of view of an h:dataTable, a column contains rows, but in
an HTML TABLE, a row contains columns, which makes mapping between the
two extremely difficult. It can be done, but it involves making a lot
of dummy jsfid="void" tags and using SPAN tags to cause elements that
wouldn't be visible in the mockup to be rendered at runtime.
e.g.,
<table jsfid="h:dataTable" var="foo" value="#{bar.list}"
><tr jsfid="void" allowBody="false">
<th>Mock Heading</th>
</tr><tr jsfid="void"
><td jsfid="h:column">
#{foo.name}
<span jsfid="h:outputText" value="Real Heading"
facetName="header"></span>
</td>
</tr>
</table>
Note that the lack of whitespace around the TR elements is intentional
to avoid (blank) text elements winding up as children of the h:dataTable
component (which is very nasty and breaks everything!).
As you can see, writing an HTML template for a dataTable gets extremely
ugly very quickly. For this reason, I don't recommend doing it unless
you REALLY want to be able to view the mockup in a browser before
deploying it. You're better off defining the template in XML and just
referring to it in the parent template, e.g.,
<table jsfid="my:customtable" allowBody="false">
Table goes here.
</table>
What we really need is a new JSF component that provides the same
capabilities as dataTable but is structured more like HTML TABLE tags.
Rich Eggert
Member of Technical Staff
Proteus Technologies, LLC
http://www.proteus-technologies.com
-----Original Message-----
From: Zheng, Xiahong [mailto:Xiahong.Zheng@FMR.COM]
Sent: Thu 4/10/2008 2:22 PM
To: user@shale.apache.org
Subject: FW: [Shale Clay]
I couldn't seem to understand by looking at the clay usecase example.
Can somebody post a simple example of using clay to generate a dynamic
data table, the equivalent of the JSF h:dataTable tag?
RE: [Shale Clay]
Posted by "Zheng, Xiahong" <Xi...@FMR.COM>.
Thanks again. I have another question. How does shale work with
fileload? I am trying to use t:fileUpload from tomahawk. I copied the
component definition into my clay-config.xml
<component jsfid="t:inputFileUpload"
componentType="org.apache.myfaces.HtmlInputFileUpload"
extends="baseOutput>
<attributes>
<set name="id" bindingType="VB" />
.....
</attributes>
</component>
And I added the following in my html form
<form enctype="multipart/form-data">
<input jsfid="t:inputFileUpload" value="#{mybean.symbolsFile}"
storage="file" />
<input type="submit" action="#{mybean.getQuotes}" value="Get Quotes"/>
</form>
When I hit the submit button, action method is never invoked.
Interestingly, if I remove the "enctype" attribute, action method is
indeed invoked but the input is null which is expected. I have the
extension filter configured.
Any idea?
-----Original Message-----
From: Richard Eggert [mailto:reggert@proteus-technologies.com]
Sent: Friday, April 11, 2008 7:33 AM
To: user@shale.apache.org
Subject: RE: [Shale Clay]
Yes. Basically, you would have to define a component that inherits from
h:dataTable, and give it child elements that inherit from h:column.
Each of those child elements would then contain children that make up
the content of your columns.
Rich Eggert
Member of Technical Staff
Proteus Technologies, LLC
http://www.proteus-technologies.com
-----Original Message-----
From: Zheng, Xiahong [mailto:Xiahong.Zheng@FMR.COM]
Sent: Fri 4/11/2008 12:08 AM
To: user@shale.apache.org
Subject: RE: [Shale Clay]
Thanks a lot Rich. I was able to use your first example without having
any white space issue even if I reformatted it a bit. If I want to use
the second solution, how would I define the behavior of the dataTable?
Would it still need to inherit dataTable for the looping capability
since the number of rows are dynamic?
-----Original Message-----
From: Richard Eggert [mailto:reggert@proteus-technologies.com]
Sent: Thursday, April 10, 2008 5:12 PM
To: user@shale.apache.org
Subject: RE: [Shale Clay]
My experience with dataTables and clay has been that they don't get
along very well, at least in the case of HTML templates (XML templates
are another story). This is mainly because h:dataTable has a
drastically different structure from HTML tables. h:dataTable expects
to have h:columns as its immediate child (with optional tags for header
and footer rows nested within each column), whereas HTML TABLE tags
expect to have TR (row) tags as its children (or TR tags nested within a
TBODY), with the column (TD) tags nested within each row. Essentially,
from the point of view of an h:dataTable, a column contains rows, but in
an HTML TABLE, a row contains columns, which makes mapping between the
two extremely difficult. It can be done, but it involves making a lot
of dummy jsfid="void" tags and using SPAN tags to cause elements that
wouldn't be visible in the mockup to be rendered at runtime.
e.g.,
<table jsfid="h:dataTable" var="foo" value="#{bar.list}"
><tr jsfid="void" allowBody="false">
<th>Mock Heading</th>
</tr><tr jsfid="void"
><td jsfid="h:column">
#{foo.name}
<span jsfid="h:outputText" value="Real Heading"
facetName="header"></span>
</td>
</tr>
</table>
Note that the lack of whitespace around the TR elements is intentional
to avoid (blank) text elements winding up as children of the h:dataTable
component (which is very nasty and breaks everything!).
As you can see, writing an HTML template for a dataTable gets extremely
ugly very quickly. For this reason, I don't recommend doing it unless
you REALLY want to be able to view the mockup in a browser before
deploying it. You're better off defining the template in XML and just
referring to it in the parent template, e.g.,
<table jsfid="my:customtable" allowBody="false">
Table goes here.
</table>
What we really need is a new JSF component that provides the same
capabilities as dataTable but is structured more like HTML TABLE tags.
Rich Eggert
Member of Technical Staff
Proteus Technologies, LLC
http://www.proteus-technologies.com
-----Original Message-----
From: Zheng, Xiahong [mailto:Xiahong.Zheng@FMR.COM]
Sent: Thu 4/10/2008 2:22 PM
To: user@shale.apache.org
Subject: FW: [Shale Clay]
I couldn't seem to understand by looking at the clay usecase example.
Can somebody post a simple example of using clay to generate a dynamic
data table, the equivalent of the JSF h:dataTable tag?
RE: [Shale Clay]
Posted by Richard Eggert <re...@proteus-technologies.com>.
Yes. Basically, you would have to define a component that inherits from h:dataTable, and give it child elements that inherit from h:column. Each of those child elements would then contain children that make up the content of your columns.
Rich Eggert
Member of Technical Staff
Proteus Technologies, LLC
http://www.proteus-technologies.com
-----Original Message-----
From: Zheng, Xiahong [mailto:Xiahong.Zheng@FMR.COM]
Sent: Fri 4/11/2008 12:08 AM
To: user@shale.apache.org
Subject: RE: [Shale Clay]
Thanks a lot Rich. I was able to use your first example without having
any white space issue even if I reformatted it a bit. If I want to use
the second solution, how would I define the behavior of the dataTable?
Would it still need to inherit dataTable for the looping capability
since the number of rows are dynamic?
-----Original Message-----
From: Richard Eggert [mailto:reggert@proteus-technologies.com]
Sent: Thursday, April 10, 2008 5:12 PM
To: user@shale.apache.org
Subject: RE: [Shale Clay]
My experience with dataTables and clay has been that they don't get
along very well, at least in the case of HTML templates (XML templates
are another story). This is mainly because h:dataTable has a
drastically different structure from HTML tables. h:dataTable expects
to have h:columns as its immediate child (with optional tags for header
and footer rows nested within each column), whereas HTML TABLE tags
expect to have TR (row) tags as its children (or TR tags nested within a
TBODY), with the column (TD) tags nested within each row. Essentially,
from the point of view of an h:dataTable, a column contains rows, but in
an HTML TABLE, a row contains columns, which makes mapping between the
two extremely difficult. It can be done, but it involves making a lot
of dummy jsfid="void" tags and using SPAN tags to cause elements that
wouldn't be visible in the mockup to be rendered at runtime.
e.g.,
<table jsfid="h:dataTable" var="foo" value="#{bar.list}"
><tr jsfid="void" allowBody="false">
<th>Mock Heading</th>
</tr><tr jsfid="void"
><td jsfid="h:column">
#{foo.name}
<span jsfid="h:outputText" value="Real Heading"
facetName="header"></span>
</td>
</tr>
</table>
Note that the lack of whitespace around the TR elements is intentional
to avoid (blank) text elements winding up as children of the h:dataTable
component (which is very nasty and breaks everything!).
As you can see, writing an HTML template for a dataTable gets extremely
ugly very quickly. For this reason, I don't recommend doing it unless
you REALLY want to be able to view the mockup in a browser before
deploying it. You're better off defining the template in XML and just
referring to it in the parent template, e.g.,
<table jsfid="my:customtable" allowBody="false">
Table goes here.
</table>
What we really need is a new JSF component that provides the same
capabilities as dataTable but is structured more like HTML TABLE tags.
Rich Eggert
Member of Technical Staff
Proteus Technologies, LLC
http://www.proteus-technologies.com
-----Original Message-----
From: Zheng, Xiahong [mailto:Xiahong.Zheng@FMR.COM]
Sent: Thu 4/10/2008 2:22 PM
To: user@shale.apache.org
Subject: FW: [Shale Clay]
I couldn't seem to understand by looking at the clay usecase example.
Can somebody post a simple example of using clay to generate a dynamic
data table, the equivalent of the JSF h:dataTable tag?
RE: [Shale Clay]
Posted by "Zheng, Xiahong" <Xi...@FMR.COM>.
Thanks a lot Rich. I was able to use your first example without having
any white space issue even if I reformatted it a bit. If I want to use
the second solution, how would I define the behavior of the dataTable?
Would it still need to inherit dataTable for the looping capability
since the number of rows are dynamic?
-----Original Message-----
From: Richard Eggert [mailto:reggert@proteus-technologies.com]
Sent: Thursday, April 10, 2008 5:12 PM
To: user@shale.apache.org
Subject: RE: [Shale Clay]
My experience with dataTables and clay has been that they don't get
along very well, at least in the case of HTML templates (XML templates
are another story). This is mainly because h:dataTable has a
drastically different structure from HTML tables. h:dataTable expects
to have h:columns as its immediate child (with optional tags for header
and footer rows nested within each column), whereas HTML TABLE tags
expect to have TR (row) tags as its children (or TR tags nested within a
TBODY), with the column (TD) tags nested within each row. Essentially,
from the point of view of an h:dataTable, a column contains rows, but in
an HTML TABLE, a row contains columns, which makes mapping between the
two extremely difficult. It can be done, but it involves making a lot
of dummy jsfid="void" tags and using SPAN tags to cause elements that
wouldn't be visible in the mockup to be rendered at runtime.
e.g.,
<table jsfid="h:dataTable" var="foo" value="#{bar.list}"
><tr jsfid="void" allowBody="false">
<th>Mock Heading</th>
</tr><tr jsfid="void"
><td jsfid="h:column">
#{foo.name}
<span jsfid="h:outputText" value="Real Heading"
facetName="header"></span>
</td>
</tr>
</table>
Note that the lack of whitespace around the TR elements is intentional
to avoid (blank) text elements winding up as children of the h:dataTable
component (which is very nasty and breaks everything!).
As you can see, writing an HTML template for a dataTable gets extremely
ugly very quickly. For this reason, I don't recommend doing it unless
you REALLY want to be able to view the mockup in a browser before
deploying it. You're better off defining the template in XML and just
referring to it in the parent template, e.g.,
<table jsfid="my:customtable" allowBody="false">
Table goes here.
</table>
What we really need is a new JSF component that provides the same
capabilities as dataTable but is structured more like HTML TABLE tags.
Rich Eggert
Member of Technical Staff
Proteus Technologies, LLC
http://www.proteus-technologies.com
-----Original Message-----
From: Zheng, Xiahong [mailto:Xiahong.Zheng@FMR.COM]
Sent: Thu 4/10/2008 2:22 PM
To: user@shale.apache.org
Subject: FW: [Shale Clay]
I couldn't seem to understand by looking at the clay usecase example.
Can somebody post a simple example of using clay to generate a dynamic
data table, the equivalent of the JSF h:dataTable tag?
RE: [Shale Clay]
Posted by Richard Eggert <re...@proteus-technologies.com>.
My experience with dataTables and clay has been that they don't get along very well, at least in the case of HTML templates (XML templates are another story). This is mainly because h:dataTable has a drastically different structure from HTML tables. h:dataTable expects to have h:columns as its immediate child (with optional tags for header and footer rows nested within each column), whereas HTML TABLE tags expect to have TR (row) tags as its children (or TR tags nested within a TBODY), with the column (TD) tags nested within each row. Essentially, from the point of view of an h:dataTable, a column contains rows, but in an HTML TABLE, a row contains columns, which makes mapping between the two extremely difficult. It can be done, but it involves making a lot of dummy jsfid="void" tags and using SPAN tags to cause elements that wouldn't be visible in the mockup to be rendered at runtime.
e.g.,
<table jsfid="h:dataTable" var="foo" value="#{bar.list}"
><tr jsfid="void" allowBody="false">
<th>Mock Heading</th>
</tr><tr jsfid="void"
><td jsfid="h:column">
#{foo.name}
<span jsfid="h:outputText" value="Real Heading" facetName="header"></span>
</td>
</tr>
</table>
Note that the lack of whitespace around the TR elements is intentional to avoid (blank) text elements winding up as children of the h:dataTable component (which is very nasty and breaks everything!).
As you can see, writing an HTML template for a dataTable gets extremely ugly very quickly. For this reason, I don't recommend doing it unless you REALLY want to be able to view the mockup in a browser before deploying it. You're better off defining the template in XML and just referring to it in the parent template, e.g.,
<table jsfid="my:customtable" allowBody="false">
Table goes here.
</table>
What we really need is a new JSF component that provides the same capabilities as dataTable but is structured more like HTML TABLE tags.
Rich Eggert
Member of Technical Staff
Proteus Technologies, LLC
http://www.proteus-technologies.com
-----Original Message-----
From: Zheng, Xiahong [mailto:Xiahong.Zheng@FMR.COM]
Sent: Thu 4/10/2008 2:22 PM
To: user@shale.apache.org
Subject: FW: [Shale Clay]
I couldn't seem to understand by looking at the clay usecase example.
Can somebody post a simple example of using clay to generate a dynamic
data table, the equivalent of the JSF h:dataTable tag?