CODEWITHSUNDEEP
angularjs
chovy
chovy

Reputation: 75656

empty form field is still being submitted when using angular form validation

The validation is being highlighted correctly, but when I click submit button, even with empty form field, the form is still being submitted (and nick value is undefined)

I tried adding novalidate to the form -- but that didn't help.

    <form class="nick" ng-submit="joinChat()">
        <input type="text" required name="nick" ng-model="nick" ng-minlength="2" ng-maxlength="10">
        <button>Join</button>
    </form>

I'm trying to follow this guide here: http://www.ng-newsletter.com/posts/validations.html

The joinChat() function doesn't do any validation itself. As its my understanding this shouldn't be necessary when using Angular form validation.

    $scope.joinChat = function(){
        socket.emit('chat:join', { nick: $scope.nick });
    };

Upvotes: 2

Views: 5191

Answers (1)

karaxuna
karaxuna

Reputation: 26930

Invalid input does not prevent angular form submission, instead try this:

<form class="nick" novalidate ng-submit="joinChat()" name="myform">
    <input type="text" ng-required="true" name="nick" ng-model="nick" ng-minlength="2" ng-maxlength="10">
    <button ng-disabled="myform.$invalid">Join</button>
</form>

Fiddle

Upvotes: 3

Related Questions