Defined function not being called - angularjs

Question

I have a form
<form role="form" name="signup" novalidate>
<div class="form-group" ng-class="{ 'has-error' : signup.firstname.$invalid && !signup.firstname.$pristine }">
<label>First Name</label>
<input type="text" name="firstname" class="form-control" ng-model="firstname" required>
<p ng-show="signup.firstname.$invalid && !signup.firstname.$pristine" class="help-block">You name is required.</p>
</div><div class="form-group"">
<label>Last Name</label>
<input type="text" name="lastname" class="form-control" ng-model="lastname">
</div>
<div class="form-group" ng-class="{ 'has-error' : signup.phone.$invalid && !signup.phone.$pristine }">
<label>Phone</label>
<input type="text" name="phone" class="form-control" ng-model="phone" ng-minlength="10">
<p ng-show="signup.phone.$invalid && !signup.phone.$pristine" class="help-block">Number is too short!!</p>
</div>
<div class="form-group" ng-class="{ 'has-error' : signup.email.$invalid && !signup.email.$pristine }">
<label>Email</label>
<input type="email" name="email" class="form-control" ng-model="email">
<p ng-show="signup.email.$invalid && !signup.email.$pristine" class="help-block">Enter a valid email.</p>
</div>
<div class="form-group" ng-class="{ 'has-error' : signup.password.$invalid && !signup.password.$pristine }">
<label>Password</label>
<input type="password" name="password" class="form-control" ng-model="password" ng-minlength="6">
<p ng-show="signup.password.$invalid && !signup.password.$pristine" class="help-block">Password is too short</p>
</div>
<div class="form-group" ng-class="{ 'has-error' : signup.passwordRepeat.$invalid && !signup.passwordRepeat.$pristine }">
<label>Password Repeat</label>
<input type="password" name="passwordRepeat" class="form-control" ng-model="passwordRepeat" ng-minlength="6">
<p ng-show="signup.passwordRepeat.$invalid && !signup.passwordRepeat.$pristine" class="help-block">Password repeat is too short</p>
</div>
<button type="submit" class="btn btn-primary btn-success" ng-disabled="signup.$invalid" ng-click="signing()">Create New Account</button>
</form>
it calls a controller function signing()
$scope.signing = function () { $scope.signup($scope.firstname, $scope.lastname, $scope.email, $scope.telephone, $scope.password, $scope.$passwordRepeat); }
which in turn calls
$scope.signup = function ($firstname, $lastname, $email, $phone, $password, $passwordRepeat) {....}
but the console is saying
"Error: $scope.signup is not a function"
the thing is, both functions are defined in the same controller, and it was working fine, before, i can't seem to wrap my head around what could be wrong.
It started saying there was an error, wen i tried to do form validation.
Any help will be highly appreciated.

Answer 1

The problem is that you are using the same name for the form: name="signup". This is also creating a signup property in the $scope, overriding the signup function you defined in the controller. Change one of them at it should work.