Tabella modificabile con AutoForm in Meteor

Question

Come posso creare una tabella con campi di input in Meteor. Ho usato l'esempio da http://autoform.meteor.com/update-each ma usano solo 1 campo di input.

La funzionalità funziona con questo codice:

<tbody> 
    {{#each persons}} 
     {{#autoForm id=makeUniqueID type="update" collection=Collections.Persons doc=this autosave=true}} 
     <tr> 
     <td>{{> afFieldInput name="fullName" label=false}}</td> 
     <td>{{> afFieldInput name="email" label=false}}</td> 
     <td>{{> afFieldInput name="address" label=false}}</td> 
     <td><button type="submit" class="btn btn-xs btn-danger">Delete</button></td> 
     </tr> 
     {{/autoForm}} 
    {{/each}} 
    </tbody> 

ma ha creato un elemento <form> attorno ad ogni <tr> e si avvita in sul mio html. Qual è il modo corretto per farlo?

Answer 1

Usa div s con i CSS:

<div class="table"> 
    {{#each persons}} 
    {{autoform class="tr"}} 
     <div class="td">{{> afQuickField}}</div> 
     <div class="td">{{> afQuickField}}</div> 
     <div class="td">{{> afQuickField}}</div> 
    {{/autoform}} 
    {{/each}} 
</div> 

E lo stile come tale:

.table { 
    display: table; 
} 

.tr { 
    display: table-row; 
} 

.td { 
    display: table-cell 
}