Webフォームでダイナミックな繰返し。

repetitionmodel
WHATWG Web Forms 2.0 (HTML5) Repetition Model Cross-browser Implementation


動いている様は、ここで見る事が出来るですよ。

  <form>
   <table>
    <thead>
     <tr>
      <th>Product</th>

      <th>Quantity</th>
     </tr>
    </thead>
    </tbody>
     <tr id="order" repeat="template" repeat-start="3">
      <td><input type="text" name="row[order].product" value=""></td>
      <td><input type="text" name="row[order].quantity" value="1"></td>
      <td><button type="remove">Remove This Row</button></td>

     </tr>
    </tbody>
   </table>
   <p><button type="add" template="order">Add Row</button></p>
   <p><button type="submit">Submit</button></p>
  </form>

一番簡単なのはこんだけ。かなり簡単に繰返し行を実装できる感じ。
これで、addボタンを押すと、id="order"のタグが、 ポコポコと増えていきます。 ポイントは、addボタンにあるtemplate="order"と、タグにあるrepeat属性かな。 どうやら、せっせとSpec作りもしてるらしい。

Web Forms 2.0
Working Draft ― 12 October 2006