Estoy intentando insertar en una Base de datos secciones, a toda la inserción la manejo con C# en controladores(Mi proyecto es una WebApi). Lo que quiero es que haga una inserción en cada ciclo de los for. Pero al controlador va solo una vez, y es cuando se termina de correr todo el angular(No se si me explico bien) Esto lo quiero hacer así porque quiero que con un solo botón me guarde todas las secciones. (No por cada sección que quiero crear que exista un botón y que de ahí vaya al controlador)
Mi codigo en angularJs es:
for (var i = 0; i < $scope.ListaTempProductos.length; i++) {
var Seccion = new Object();
var idUlt = $scope.SeccionUltima;
var idSeccionObtenida = idUlt[0]['idSeccion'];
DetalleSeccion.idSeccion = idSeccionObtenida;
DetalleSeccion.idProducto = $scope.ListaTempProductos[i]['idProducto'];
CrearDetalleSeccion(JSON.stringify(DetalleSeccion));
}
for (var i = 0; i < $scope.ListaTempPlatos.length; i++) {
var Seccion = new Object();
var idUlt = $scope.SeccionUltima;
var idSeccionObtenida = idUlt[0]['idSeccion'];
DetalleSeccion.idSeccion = idSeccionObtenida;
DetalleSeccion.idPlato = $scope.ListaTempPlatos[i]['idPlato'];
CrearDetalleSeccion(JSON.stringify(DetalleSeccion));
}
function CrearDetalleSeccion(detalle) {
//Crea detalle tercero
var idDetalle = $http.post('/api/DetalleSeccion/PostDetalleSeccion', detalle).then(function (response) {
alert("guardado");
});
}
Mi html es:
<form class="form-inline" id="formSeccionDetalle" style="margin:10px; visibility:hidden; background-color:azure;">
<div class="form-group" style="margin:10px;">
<label for="nombre">Seleccione los productos que iran en esta sección:</label>
<div>
<select class="form-control" id="listaProductosParaDetalle">
<option ng-repeat="dto in productos"> {{dto.nombreProducto}} </option>
</select>
</div>
<div>
<button type="submit" class="btn btn-toolbar btn-circle" id="AgregarProducto"><i class="fa fa-plus fa-2x" aria-hidden="true"></i></button>
</div>
</div>
<div class="form-group" style="margin:10px;">
<label for="nombre">Seleccione los platos que iran en esta sección:</label>
<div>
<select class="form-control" id="listaPlatosParaDetalle">
<option ng-repeat="dto in platos"> {{dto.nombrePlato}} </option>
</select>
</div>
<div>
<button type="submit" class="btn btn-toolbar btn-circle" id="AgregarPlato"><i class="fa fa-plus fa-2x" aria-hidden="true"></i></button>
</div>
</div>
<div class="form-group" style="margin:10px;">
<div>
<ul>
<li ng-repeat="x in ListaTempProductos">
{{ x.nombreProducto }}
<button class="btn btn-danger" id="btnBorrar" ng-click="EliminarProducto($index)">
<i class="fa fa-times" aria-hidden="true"></i>
</button>
</li>
</ul>
<ul>
<li ng-repeat="x in ListaTempPlatos">
{{ x.nombrePlato }}
<button class="btn btn-danger" id="btnBorrar" ng-click="EliminarPlato($index)">
<i class="fa fa-times" aria-hidden="true"></i>
</button>
</li>
</ul>
<button class="btn btn-danger" id="guardarTodo">
<i class="fa fa-2x fa-save" aria-hidden="true"></i>
</button>
</div>
</div>
</form>
Alguien me podría explicar de manera resumida como es que puedo alterar el orden de esto?