469,362 Members | 2,548 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,362 developers. It's quick & easy.

Noob Q: dynamic parameters and conditional styles?

kj


I have a dynamically generated HTML document that includes a table
of numbers. In this table, I want every number greater than some
numerical parameter MAX_VAL (also dynamically generated) to be
rendered as "> " followed by the string form of MAX_VAL. For
example, if MAX_VAL is 1000, and a row in this table consists of
the numbers 500, 1000, and 200, i.e.

<TR>
<TD CLASS="nifty" MAX_VAL=1000>500</TD>
<TD CLASS="nifty" MAX_VAL=1000>1000</TD>
<TD CLASS="nifty" MAX_VAL=1000>2000</TD>
</TR>

I want that row to be rendered like this:

| 500 | 1000 | > 1000 |

Can this be done with CSS? It would require at least three things
I don't know how to do:

* First, the CSS would have to be able to work with a user-defined
parameter (in this case MAX_VAL).

* Second, it would have to be able to produce different styles
conditional on the value of this parameter.

* And third, one of these styles must be able to incorporate the
string version of this user-defined parameter in the generated
output.

Is this a pipe dream?

Any clues on how this can be done would be much appreciated.

Thanks in advance!

kj

--
NOTE: In my address everything before the first period is backwards;
and the last period, and everything after it, should be discarded.
Apr 24 '06 #1
4 1460
kj wrote:
I have a dynamically generated HTML document that includes a table
of numbers. In this table, I want every number greater than some
numerical parameter MAX_VAL (also dynamically generated) to be
rendered as "> " followed by the string form of MAX_VAL. For
example, if MAX_VAL is 1000, and a row in this table consists of
the numbers 500, 1000, and 200, i.e.

<TR>
<TD CLASS="nifty" MAX_VAL=1000>500</TD>
<TD CLASS="nifty" MAX_VAL=1000>1000</TD>
<TD CLASS="nifty" MAX_VAL=1000>2000</TD>
</TR>
This is not an HTML document as no version of HTML has a "MAX_VAL"
attribute.
I want that row to be rendered like this:

| 500 | 1000 | > 1000 |

Can this be done with CSS?
No.
* First, the CSS would have to be able to work with a user-defined
parameter (in this case MAX_VAL).
CSS can work with generic XML documents, so this isn't a problem (assuming
you started using XML)
* Second, it would have to be able to produce different styles
conditional on the value of this parameter.
Attribute selectors let you do this (although only on pattern matching,
maths isn't possible with them).
* And third, one of these styles must be able to incorporate the
string version of this user-defined parameter in the generated
output.
This is possible with the content property. (Well, ish).

You also would need the ability to process the content of the element.
Any clues on how this can be done would be much appreciated.


Transform it on the server and output the content you want to display.

--
David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
Home is where the ~/.bashrc is
Apr 24 '06 #2
KMA
Just an idea, but can't you get the server side generator to use two
classes, "nifty" and "Bignifty", then css can highlight the Bigniftys.

"kj" <so***@987jk.com.invalid> wrote in message
news:e2**********@reader1.panix.com...


I have a dynamically generated HTML document that includes a table
of numbers. In this table, I want every number greater than some
numerical parameter MAX_VAL (also dynamically generated) to be
rendered as "> " followed by the string form of MAX_VAL. For
example, if MAX_VAL is 1000, and a row in this table consists of
the numbers 500, 1000, and 200, i.e.

<TR>
<TD CLASS="nifty" MAX_VAL=1000>500</TD>
<TD CLASS="nifty" MAX_VAL=1000>1000</TD>
<TD CLASS="nifty" MAX_VAL=1000>2000</TD>
</TR>

I want that row to be rendered like this:

| 500 | 1000 | > 1000 |

Can this be done with CSS? It would require at least three things
I don't know how to do:

* First, the CSS would have to be able to work with a user-defined
parameter (in this case MAX_VAL).

* Second, it would have to be able to produce different styles
conditional on the value of this parameter.

* And third, one of these styles must be able to incorporate the
string version of this user-defined parameter in the generated
output.

Is this a pipe dream?

Any clues on how this can be done would be much appreciated.

Thanks in advance!

kj

--
NOTE: In my address everything before the first period is backwards;
and the last period, and everything after it, should be discarded.

Apr 25 '06 #3

kj wrote:
Can this be done with CSS?


No.

It might almost be possible using attribute selectors, _IF_ your
problem were only a little simpler and just required an equality test,
not a comparison. However even then you'd be relying on CSS features
of recent spec versions that aren't widely supported. It wouldn't work,
it wouldn't work if CSS was unavailable, it wouldn't work on older
browsers, it wouldn't be at all accessible and most of all it's pretty
contrary to the whole ethos of CSS.

Don't use CSS to mess with content. Use it to present content that you
already have.

I'd suggest some scripting (ideally server-side, but client side would
be OK) that sets a class attribute value of "max-exceeded" onto the
rows >MAX_VAL. CSS could then colour these rows accordingly.

CSS _could_ even change the presentation of the large value into
invisiblilty and a flat text warning message "> MAX", if this class was
set. This would be possible, even quite easy to do, but it wouldn't be
portable (IE is still too broken and too commonplace). Technically
you could do this, practically you shouldn't.

Apr 25 '06 #4
kj <so***@987jk.com.invalid> writes:
<TR>
<TD CLASS="nifty" MAX_VAL=1000>500</TD>
<TD CLASS="nifty" MAX_VAL=1000>1000</TD>
<TD CLASS="nifty" MAX_VAL=1000>2000</TD>
</TR>

I want that row to be rendered like this:

| 500 | 1000 | > 1000 |

Can this be done with CSS?


That's a perfectly fair question. CSS is about presentation, and what
you're specifying is presentation.

But from a CSS standpoint, what you're specifying is content. It's
better not to try to do it with CSS.

You've stumbled upon an important point that is often missed. Many
server-side frameworks out there seek to enforce that presentation
specification and logic/content specification stay on their own sides of
the line. The problem is, often there's no line.

--

http://ourdoings.com/ Easily organize and disseminate news and
photos for your family or group.
Apr 25 '06 #5

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

2 posts views Thread by znelson | last post: by
reply views Thread by Martin Buchleitner | last post: by
28 posts views Thread by Benjamin Niemann | last post: by
1 post views Thread by Nathan Bloomfield | last post: by
reply views Thread by jason | last post: by
4 posts views Thread by jobs | last post: by
1 post views Thread by Japskunk | last post: by
2 posts views Thread by pinman | last post: by
1 post views Thread by CARIGAR | last post: by
reply views Thread by zhoujie | last post: by
1 post views Thread by Marylou17 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.