I have a form containing an ng-repeat, with some input hidden field that i need to pass to the server. This is the code of the page:
<form ng-controller="FrmController" method="post">
<div class="orderlist">
<table class="table gas">
<thead>
<tr>
<th scope="col" ng-click="orderByField='image'; reverseSort = !reverseSort">Immagine
<span ng-show="orderByField == 'image'" class="listorder">
<span ng-show="!reverseSort"><i class="fa fa-sort-desc"></i> </span>
<span ng-show="reverseSort"><i class="fa fa-sort-asc"></i></span>
</span>
</th>
[...]
</thead>
<tbody id="gasbody" ng-repeat="product in products | filter: searchQuery | orderBy:orderByField:reverseSort" class="repeated-item">
<tr>
<input type="hidden" name="form-x-id" ng-model="form.form-x-id">
(x represent the index of the ng-repeat)
[...]
<button ng-click="addtoCart();" class="def-btn" type="submit"><span class="glyphicon glyphicon-shopping-cart"></span> Add to cart</button>
</form>
This is the code of the controller:
function FrmController($scope,$http,transformRequestAsFormPost){
$scope.form = {};
$scope.addtoCart = function() {
$http({
method: 'POST',
url: '',
data: $.param($scope.form),
headers: {'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'}
});
}
}
I need to send data in this format:
form-1-id: value
form-2-id: value2
form-3-id: value3
$scope.form = {form-1-id: value,
form-2-id: value2,
form-3-id: value3, ...
... form-n-id: valuen}
where n represent the lenght of ng-repeat.
ecc....
How can i dynamically add field to a $scope binded to a ng-model? Is it possible?
Thanks
I dont underestant exactly , what do you want ? Do you want index of ng-repeat?
You can just use $index like this
<input name="form-{{$index}}-id" type="Hidden" ng-model="form[$index]">
Or do you want to push something to your form dynamically? You can use:
$scope.addToForm=function(newItem){
$scope.form.push(newItem)
}
Of course you have to change your form={} , to form=[]