[uf-discuss] input microformats for auto-filling forms

[Glenn Jones]

Stephen thanks for the feedback, I have tried to reply to the major points:

>> Strongly disagree.  As I understand it, µformats are about defining 
>> vocabularies and how those vocabularies can be best encoded using 
>> existing HTML semantics.  Restricting to class and rel is short-sighted.

I agree with Tantek's point;  "names" being only single values like "id" makes them hard to use as attributes for adding additional semantic information.  I also think we should not force the web page author to change the presentation of the form or the server side logic. 

>> In fact, using class if you are not going to have a meaningful 
>> value="" will just *confuse* existing parsers, leading them to get a blank object.

When parsers such as Operator test for required fields they disregard any microformats which are left blank. By adding an additional "input" classname with the microformat root name i.e. class="vcard input" the current parsers could be upgraded to disregard blank mircoformats.


The repeat pattern
Stephen, from your questions it looks like I may not have explained the repeat pattern clearly or given good use case examples. Below is a real word example. The hCard data for my work address stored as JSON would look like this:

adr[ {
"extended-address":  ["Suite 1"]
"street-address":  [ "Clarence House", "30-31 North Street"],
"locality":  "Brighton",
"region":  "East Sussex
"postal-code":  "BN1 1EB
"country-name":  "United Kingdom,
"type":  "work"
}]

If we look at the Argos (Large UK retail store chain) delivery form as an example http://www.flickr.com/photos/glennjonesnet/5415535821/ you will see a three line address structure. This is a common pattern; although the use of the extended address elements can differ.

<input type="text" name="houseNumber" id="houseNumber" class="text"> <input type="text" name="address1" id="address1" class="text"> <input type="text" name="address2" id="address2" class="text">

This would be marked up with the microformat classes below:

<input class="extended-address "  type="text" name="houseNumber" id="houseNumber" class="text"> <input class=" street-address "  type="text" name="address1" id="address1" class="text"> <input class=" street-address "  type="text" name="address2" id="address2" class="text">

The auto-fill would apply the following values. The street-address repeats into the two form fields with the street-address class.
houseNumber = Suite 1
address1 = Clarence House
address2 = 30-31 North Street

Repeating microformat properties
There are quite a few examples of this interface pattern, the Facebook contact form telephone field is any interesting example http://www.flickr.com/photos/glennjonesnet/5416146406/. Every time you add a telephone number the form updates client side and adds another field group. The code for this part of the form looks like this:

<div>
<select name="phones[000000000000000000][type]">
<option value="1">Work</option>
<option value="2">Home</option>
<option selected="1" value="3">Mobile</option> </select> <input type="text" value="1273715615" size="14" name="phones[000000000000000000][number]" class="inputtext"> <select class="profilePhoneCountry" name="phones[000000000000000000][country]">
<option value="AF">Afghanistan (+93)</option>
...
</select>

It could be marked-up
<div class="tel repeat">
<select class="type " name="phones[000000000000000000][type]">
<option value="work">Work</option>
<option value="home">Home</option>
<option selected="1" value="cell">Mobile</option> </select> <input class="value " type="text" value="1273000000" size="14" name="phones[000000000000000000][number]" class="inputtext"> <select class="country-name profilePhoneCountry" name="phones[000000000000000000][country]">
<option value="AF">Afghanistan (+93)</option> 
...
 </select> </div>

For each phone number the auto-fill application would clone the whole div structure and add this into the page. It would replicate how the interface currently works with user interaction.  

>> though for safety one ought to append [] (IIRC pioneered by PHP, 
>> picked up by others due to the popularity of PHP)

Stephen, this is an interesting point, we need to research how different technologies use the name attribute if we are to take on the "repeat" pattern. 

Thanks Glenn