Hi David,
Thanks for the tips. Unfortunately the data for this exhibit page is
streaming from a published Google spreadsheet so I haven't been able to
control the JSON data stream (to be able to declare the value type of the
"start" end "end"
property to be "date").
Is there any way to have an additional file that has just that properties
section in it and then get the stream for the data?
The columnFormats tweak works to change the date format.
The row template change works as far as controlling the column widths but
trying to add the columnFormats on top to fix the date format doesn't work.
I tried putting a ex:format="{ date { template: 'dd MMM yyyy' }" inside the
<td> section but it is ignored.
Is it possible to use ex:format on the td and my syntax is not quite right?
Thanks for the help so far.
Peter
-----Original Message-----
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
On Behalf Of David Huynh
Sent: Thursday, 13 March 2008 5:22 AM
To: [EMAIL PROTECTED]; General List
Subject: Re: Exhibit: Controlling the Table View
Peter Frederick wrote:
> Hi Exhibitors,
>
> I've been working on an internal Exhibit with a table but I'm having some
> trouble controlling how the columns appear.
>
> This is the current table view definition:
>
> <div ex:role="exhibit-view" ex:viewClass="Exhibit.TabularView"
> ex:columns=".start, .end, .label, .description"
> ex:columnLabels="Starting, Ending, Label, Description"
> ex:columnFormats="date {mode:short}, list, list, list"></div>
>
> .start and .end are dates in format YYYY-MM-DD, .label is the brief
> description and .description is long text (say up to 300 characters).
>
> Q1 How can I show the first two date columns in an DD MM YYYY format or DD
> MMM YYYY format?
>
First, you should declare the value type of the "start" end "end"
property to be "date". This can be done in your data file:
{
items: [
...
],
properties: {
"start" : {
valueType: "date"
},
"end" : {
valueType: "date"
}
}
}
Then you can tweak ex:columnFormats a little to get your custom formats:
ex:columnFormats="date { template: 'dd MMM yyyy' }, date { template:
'dd MMM yyyy' }, ..."
Alternatively, you can put the date format in the <body>:
<body ex:formats="date { template: 'dd MMM yyyy' }">
This causes all dates in your exhibit to be formatted that way.
> Q2 How can I set the column widths up to be useful (say 10% 10% 20% 60%
for
> example). Does this have to be done via CSS? I'm a bit of a CSS novice
(but
> I've got the O'Reilly book and been working on hard on it!)
>
In this case you need to specify a row template within the tabular view:
<div ex:role="view" ex:viewClass="Tabular"
ex:formats="date { template: 'dd MMM yyyy' }"
ex:columns=".start, .end, .label, .description"
ex:columnLabels="Starting, Ending, Label, Description">
<table>
<tr>
<td width="10%" ex:content=".start"></td>
<td width="10%" ex:content=".end"></td>
<td width="20%" ex:content=".label"></td>
<td width="60%" ex:content=".description"></td>
</tr>
</table>
</div>
Let me know if it doesn't work. I haven't tested this case. Note that
ex:columns are still there for sorting purposes. And ex:columnLabels are
for the column headers.
> I've been scouring the WIKI pages but info about this type of control is
> pretty sparse there. Obviously you can do HEAPS of things with smart CSS
and
> a bit of javascript but that isn't my programming background :*(
>
David
_______________________________________________
General mailing list
[email protected]
http://simile.mit.edu/mailman/listinfo/general
_______________________________________________
General mailing list
[email protected]
http://simile.mit.edu/mailman/listinfo/general
