[whatwg] [WF2] Fixing Repetition Template Degradation in IE without Scripting

[Lachlan Hunt]

Hi,
   I've just done some experements with the repetition templates, and 
tried to devise a way to help IE end up with usable submit buttons, 
rather than useless push buttons.  The solution I came up with involves 
a little (read: extremely evil and dirty) hack with IE's proprietary 
conditional comments.

However, it doesn't quite work as expected, and I thought someone may be 
able to figure out a way to extend this idea a little more to make it work.


For the remove button, this displays the correct button for IE 5 and 6.

<!--[if IE 1]>--><button type="remove" name="remove" value="[player]">
     Remove</button><!--<![endif]-->

<!--[if IE]><button name="remove" value="[player]" type="submit">
     Remove</button><![endif]-->


Note: This: <!--[if IE 1]>-->...<!--<![endif]--> is a validating version 
of the so-called "downlevel-revealed" conditional comment:
   <![if expression]> HTML <![endif]>
(which should probaby be nick-named "uplevel-revealed" :-)).


For the add button, this code works as intended, but still buggy like 
remove is (as I will explain later):

<!--[if IE 1]>--><button type="add" name="add" value="add">
     Add Player</button><!--<![endif]-->

<!--[if IE]><button type="submit" name="add" value="add">
     Add Player</button><![endif]-->


Ok, the problem with the solution is that IE still sends the name/value 
pair for both the add and remove button regardless of which one was 
clicked (ie. "successful") and sends the button label as the value, 
rather than the value attribute.  This can be seen by looking at the 
resultant query string from the submission:

...&remove=Remove+IE&add=Add+Player+%28IE%29

This seems to works as intended for the add button because the add 
name/value pair must be detected and used in the server-side script, 
before the remove.  So, it ends up adding a field regardless of which 
button was pressed.

The only solution I could think of was to change the <button>s to 
<input>s, however the buttons would then be labeled with the text from 
the value attribute (ie. "[player]" and "add" for remove and add 
buttons, respectively).  And changing that value attribute, at least for 
the remove button, would stop server-side script form working correctly 
to remove the correct fields.


Lastly, for anyone wondering how this solution would work after IE7 is 
released, and if IE fixes their <button> implementation, then the 
conditonal comments can be altered as follows:

Change: <!--[if IE 1]>--> To: <!--[if IE 7]><!-- -- -->
Change: <!--[if IE]>      To: <!--[if lt IE 7]>

However, even without these alterations the IE 5/6 version of the 
buttons should still work in IE7 anyway.

Without the special <!-- -- --> pseudo-comment [1], IE7 would end up 
outputting the "-->" from the original "if IE 1" version.  The 3 
double-hyphens "--" ensures that the enitire comment remains valid in SGML.

[1] I called it a pseudo comment because it's not really a full comment 
in SGML terms, it only looks like one.  The real SGML comment is the 
full thing including: <!-- ... -- -- -->

-- 
Lachlan Hunt
http://lachy.id.au/
http://GetFirefox.com/     Rediscover the Web
http://GetThunderbird.com/ Reclaim your Inbox