RE: Styling based on instance data

Greetings Leigh, I would agree that there are cases where styling 
dependent on the value would be useful. A situation I have encountered is 
the need to style negative numbers differently to positive numbers.

Regards, Roland



"Klotz, Leigh" <Leigh.Klotz@xerox.com> 
Sent by: www-forms-request@w3.org
01/12/2006 00:25

To
<jeacott@hardlight.com.au>
cc
"www-forms" <www-forms@w3.org>
Subject
RE: Styling based on instance data







Thank you.  I am using the word "selected" in a confusing way here.
I didn't mean the thing that is expressible using the proposed CSS3
pseudo-element ::repeat-index, but instead an application-specific
definition of selected, which in my example below is dependent on the
value of an attribute on the repeated node.
Leigh.

-----Original Message-----
From: Jason [mailto:jeacott@hardlight.com.au] 
Sent: Thursday, November 30, 2006 4:20 PM
To: Klotz, Leigh
Cc: www-forms
Subject: Re: Styling based on instance data

I think Chiba lets you do this by preprocessing and exposing this detail

in a css hookable way.

eg:
<xf:repeat xf:appearance="full"...>
becomes:
<table class="compact-repeat valid | invalid readonly |
readwrite optional | required">
<tr class="repeat-item"> (has additional 'repeat-index' here
when selected)

sorry this doesnt help you with pure a xform, but then I guess with a 
pure xforms there is no guarantee that the platform that supports xforms

also supports css, or anything else you might be using.

Jason.

Klotz, Leigh wrote:
> Itwouldbeniceif you could use CSS to style the background of repeat
> items yellow if they are "selected" in the data using some magical CSS
> XPath selector:
> 
> <style type="text/css">
> 
>
repeat.lines::repeat-item[xpath(boolean-from-string(instance()/lines/lin
> e/@selected))] { background-color: yellow; }
>   ...
> </style>
> 
> <repeat class="lines" nodeset="lines/line">
>   <input ref="@selected">
>     <label class="columnHeader">X</label>
>   </input>
>   <output ref="date">
>     <label class="columnHeader">Date</label>
>   </output>
>   <output ref="name">
>     <label class="columnHeader">Name</label>
>   </output>
> </repeat>
> 
> 
>