如何提交具有相同名称的多个输入的表单

时间:2018-02-08 10:21:07

标签: angularjs forms

我有一个包含三个输入字段的表单和添加新行的函数:

<form ng-submit="">
 <fieldset  data-ng-repeat="person in persons">    
  <input type="text" ng-model="username">
  <input type="text" ng-model="house">
  <input type="text" ng-model="points">
 </fieldset>
 <button ng-click="addNewChoice()">Add fields</button><input type="submit" value="Submit">
</form>

然后我尝试打印数据并将其清空。

<div id="choicesDisplay">
  {{ persons }}
</div>

js part:

$scope.persons = [];
$scope.addNewChoice = function() {
  var newItemNo = $scope.persons.length + 1;
  $scope.persons.push({
    'username': "",
    'house': "",
    'points': "",
  });
};
$scope.removeChoice = function() {
  var lastItem = $scope.persons.length-1;
  $scope.persons.splice(lastItem);
};

如何将表单作为数组提交?我不能使用username[]。谢谢

1 个答案:

答案 0 :(得分:1)

需要用户<input type="text" ng-model="person.username">

HTML:

<form ng-submit="">
     <fieldset  data-ng-repeat="person in persons">    
      <input type="text" ng-model="person.username">
      <input type="text" ng-model="person.house">
      <input type="text" ng-model="person.points">
     </fieldset>
     <button ng-click="addNewChoice()">Add fields</button><input type="submit" value="Submit">
    </form>

然后我尝试打印数据并将其清空。

<div id="choicesDisplay">
  {{ persons }}
</div>

js part:

$scope.persons = [];
$scope.addNewChoice = function() {
  var newItemNo = $scope.persons.length + 1;
  $scope.persons.push({
    'username': "",
    'house': "",
    'points': "",
  });
};
$scope.removeChoice = function() {
  var lastItem = $scope.persons.length-1;
  $scope.persons.splice(lastItem);
};