您可以将所有值绑定到一个共同的目标。我在提交第一个表单后启用第二个表单。在第二种形式提交功能中,您只需循环访问常用对象的值并将其附加到formData
。如果您没有任何理由拥有两种形式,则可以将其合并为一个。
注意:我还没有添加任何表单验证。对于添加的表单验证,请参阅https://codepen.io/sevilayha/pen/xFcdI
HTML:
<form name="form1" ng-submit="enableForm2()">
<input type="text" name="fname" ng-model="obj.fname" />
<input type="text" name="lname" ng-model="obj.lname" />
<input type="submit" value="Next" />
</form>
<form name="form2" ng-show="enableForm" ng-submit="finalSubmit()">
<input type="text" name="address" ng-model="obj.address" />
<input type="text" name="state" ng-model="obj.state" />
<input type="submit" value="Next" />
</form>
JS:
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $http) {
$scope.obj = {};
$scope.enableForm = false;
$scope.enableForm2 = function() {
$scope.enableForm = true;
}
$scope.finalSubmit = function() {
$http({
method: 'POST',
url: YourURL,
withCredentials: true,
headers: {
'Content-Type': undefined
},
data: {},
transformRequest: function(data, headersGetter) {
var formData = new FormData();
angular.forEach($scope.obj, function(value, key) {
formData.append(key, value);
})
return formData;
}
}).then(function(data) {
$scope.enableForm=false;
}).catch(function(data, status) {
})
}
});
是其可能的。您只需捕获第一个表单的值和提交第二个表单的值,使用formData附加所有您捕获的值。 – Vivz
嗨Vivz。谢谢。点击第一个提交按钮后,我可以验证第一个表单并滚动到第二个表单,最后我能够从这两个表单中捕获数据并提交它? –
如何从多个表单中捕获数据? $ scope.modelname? –