I am facing a challenge with coding a large search form in AngularJS. The form has around 45 inputs and I am new to Angular, so I'm struggling to find the best approach. My main issue is figuring out how to handle passing values from the form while using a service in an injected factory.
Here's the current structure of my project:
app.js - app module
search.js - search controller
datacontext.js - service factory
search.html - search form view
The datacontext contains a Search function that triggers the search service call:
function Search(searchForm) {
var deferred = $q.defer();
var requestParameters = {
UserId: 1234,
IpAddress: '127.0.0.1',
QuickSearch: true
};
var request = {
SearchParameters: searchForm,
RequestParameters: requestParameters
};
$http.post(url, request)
.success(function (data, status) {
deferred.resolve(data);
})
.error(function(data, status) {
deferred.reject(data);
});
}
To simplify the Search function, I pass in a search object containing all search properties like firstName, lastName, dob, etc. When calling this function from the search controller, can I simply pass in the $scope from the form (e.g., ng-click='RunSearch($scope)')?
Additionally, I need to ensure that the user enters criteria before running the search. How can I implement a feature to count the criteria being passed in when they click the search button? Any advice or tips from experienced developers would be greatly appreciated. Thank you!