Angular form not working in a table

Question

I created a working form placed in a div below a table;

  

           


        
                      

              相关标签:
       
      

Answer 1

The way you are doing, will not render the html correctly on the page, because its invalid html as per table standards. Basically behind the scene html renderer will throw out this from out of the table tag while rendering the html on page. So for having form inside table tag, you could use ng-form attribute instead of having form element.

But by using ng-form directive you can't have ng-submit directive, you should submit a form via button only.

Html

<tr ng-form="myForm">
    <td>Add an item</td>
    <td><input type="text" name="name" id="newName" class="form-control" placeholder="Name" required ng-model="controller.add.name"></td>
    <td><textarea name="description" id="newDescription" class="form-control" placeholder="Description" ng-model="controller.add.description"></textarea></td>
    <td><button class="btn btn-xs btn-primary" type="button" ng-click="controller.add.save()">Add</button></td>
</tr>

For more detailed answer about structuring of table, you could refer this answer