I have almost resolved my issue, but now I need help with sending the data to the server.
In my current situation, there is a form that includes employee details and projects for that employee (which can be multiple).
When the user wants to add projects, they need to click on "Add Projects". This action will generate a dropdown on the page containing a list of available projects.
The user can select any number of projects. Once they have selected their desired projects (let's say 5), they can click submit to post the data to the server.
I would like all the selections from the dropdown lists to be stored in an array and then sent to the save function.
Here is the HTML Code:
<div>
<div ng-controller="AlertDemoCtrl">
<alert ng-repeat="alert in alerts" type="alert.type" close="closeAlert($index)" ng-model="ProjectId[item]">
<ul style="list-style-type: none; margin-left: 0px;">
<li >
<select>
<option value="">-- Choose a Project --</option>
<option ng-repeat="item in items" value="item.ProjectId">{{item.ProjectName}}</option>
</select>
<button type="button" ng-click="closeAlert($index)"><img src="delete.png" alt="Remove" style="height:20px; width:20px;" /></button>
</li>
</ul>
</alert>
<button class='btn' type='button' ng-click="addAlert()">Add Projects</button>
</div>
</div>
The 'alert' custom directive adds new dropdown lists to the form. Remember to create a controller for adding new employee data.
var CreateCtrlEmp = function ($scope, $location, SampleEmp, SampleProj, SampleDes, sharedValues) {
$scope.items = SampleProj.query({ q: $scope.query });
$scope.itemsd = SampleDes.query({ q: $scope.query });
alert("Entered the saving function");
$scope.save = function () {
$scope.item.ProjectId = [];
SampleEmp.save($scope.item);
$location.path('/emp');
};};
Your help would be greatly appreciated.
Thanks a lot!
Tushar Sharma