Adding a new row with autoform and a html table - meteor

Question

I'm experimenting with Autoforms and an array field in a html table. So far I can modify rows and delete them, but am having trouble working out how to add a new row. The add button doesn't seem to do anything.
My code so far:
{{#autoForm id="eventDatesForm" type="update" collection="Events" doc=this buttonContent="Save"}}
<h2>Event Dates</h2>
{{> afQuickField name="timezone"}}
<table class="table table-bordered table-hover table-condensed">
<thead>
<tr>
<th>Slice Start</th>
<th>Slice End</th>
<th><button type="button" class="btn btn-primary autoform-add-item" data-autoform-field="{{this.atts.name}}" data-autoform-minCount="{{this.atts.minCount}}" data-autoform-maxCount="{{this.atts.maxCount}}"><span class="glyphicon glyphicon-plus"></span></button></th>
</tr>
</thead>
{{#afEachArrayItem name="WiFiOffloadSettings"}}
<tbody>
<tr>
<td>{{> afFieldInput name=this.current.offloadSliceStart type=datetime}}</td>
<td>{{> afFieldInput name=this.current.offloadSliceEnd type=datetime}}</td>
<td><button type="button" class="btn btn-danger btn-sm autoform-remove-item"><span class="glyphicon glyphicon-minus"></span></button></td>
</tr>
</tbody>
{{/afEachArrayItem}}
</table>
<button type="submit" class="btn btn-primary">Save</button>
{{/autoForm}}

Answer 1

In the Add button, try using the name "WiFiOffloadSettings".
That is,
<button type="button" class="btn btn-primary autoform-add-item"
data-autoform-field="WiFiOffloadSettings" data-autoform-minCount="
{{this.atts.minCount}}" data-autoform-maxCount= {this.atts.maxCount}}">
<span class="glyphicon glyphicon-plus"></span> </button>