點擊ng-repeat表單中的所有提交按鈕

我有一個使用MEAN棧的angularjs ng-repeat表單，其中我有一個外部按鈕，在ng-repeat之外觸發所有的ng-repeat表單。但是這樣做只提交了第一個ng-repeat表單。所有其他人都沒有提交。我應該如何通過一次點擊提交所有表單。點擊ng-repeat表單中的所有提交按鈕

HTML

<div class="ui-widget-content"> 
<ol class="minheight650"> 
    <div class="overflow-y-scroll"> 
    <div ng-repeat="item in subfoodss track by $index | filter:categoryfilter | filter:typefilter | filter:searchallfood"> 
     <li ng-show="item.name" > 
     <div class="col-md-4"> 
      <form name="subfoodForm" id="subfoodform" data-ng-submit="addSubfood()" > 
      <input type="text" data-ng-model="sbody" name="sbody" id="sbody" class="form-control" placeholder="Your Subfood" required disabled> 
      <input type="text" data-ng-model="sprice" name="sprice" id="sprice" class="form-control" placeholder="Your Subfood" required disabled> 
      <md-select data-ng-model="sqty" id="sqty" required> 
      <md-option value="1" selected>1</md-option> 
      <md-option value="2">2</md-option> 
      <md-option value="3">3</md-option> 
      </md-select> 
      <div class="col-md-3 "> 
      <input type="checkbox" > 
      </div> 
      <input type="submit" ng-click="secondFx()" id="btnTwo" value="Subfood"> 
     </form> 
     </div> 
    </li> 
    </div> 
    </div> 
    <div> 
    <md-switch class="md-primary" ng-click="doSomething()" id="selecctall"> 
     <h4>Confirm All</h4> 
    </md-switch> 
    </div> 
</ol> 
</div>

AngularJS控制器

$scope.secondFx = function() { 
    angular.element('#btnTwo').click(); 
}; 

$scope.doSomething = function() { 
$scope.secondFx(); 
};

來源

2015-12-23 Rohit Vinay

您已爲重複中的所有表單指定了相同的ID。你應該嘗試使用$ index來區分它們。另外，文檔指出您應該避免在表單中同時使用ng-submit和ng-click。 –

是的，你應該定義使用不同的ID，甚至更多，爲什麼你需要多種形式？難道你不能只有多個輸入綁定到'$ scope'中的數組（http://stackoverflow.com/questions/15488342/binding-inputs-to-an-array-of-primitives-using-ngrepeat-uneditable輸入） – victor

在控制器參考元件是不是一個好主意（關注的分離），所以不做angular.element('#btnTwo').click();

我認爲最好的解決方案是創建一個將提交al的指令l兒童表格。該指令可以被添加到selecctall按鈕，並在點擊時作出反應。

這樣對你有好處嗎？

來源

2015-12-23 08:49:48

或者更好的替換'angular.element（'＃btnTwo'）。click（）;'帶一個'angular.element（'。markerClass'）。click（）;' - 它會觸發click事件on它找到的所有按鈕 – victor

實際上，引用控制器中的DOM元素不是一種好的做法（主要是因爲控制器不必知道該視圖）。指令在這裏（操作DOM，觸發或響應事件等），所以在這種情況下，這是一個更好的解決方案。 –

是的，同意。我想說的是，一個指令有點太過分了。事實上，單一的形式可能就足夠了，我認爲這就是「髒」的部分。你不需要那個。只是「重複」所有的輸入，而不是整個形式 – victor

點擊ng-repeat表單中的所有提交按鈕

回答

相關問題