Skip to content

Instantly share code, notes, and snippets.

@IanSmith89
Created July 30, 2016 00:15
Show Gist options
  • Save IanSmith89/829a1ab6580a9f6a5067597884cbd357 to your computer and use it in GitHub Desktop.
Save IanSmith89/829a1ab6580a9f6a5067597884cbd357 to your computer and use it in GitHub Desktop.
Angular Form Validation with Materialize
<form ng-submit="CONTROLLER.submitTopic(); topicForm.$setPristine();" name="topicForm" novalidate>
<div class="input-field">
<input type="text" name="name" ng-class="{'valid': topicForm.name.$valid, 'invalid': topicForm.name.$invalid && topicForm.name.$dirty}" ng-model="CONTROLLER.topicForm.name" ng-minlength=3 ng-maxlength=15 required>
<label for="name" ng-class="{'green-text text-lighten-2': topicForm.name.$valid, 'red-text text-lighten-2': topicForm.name.$invalid && topicForm.name.$dirty}">Topic Name</label>
<span ng-show="topicForm.name.$error.minlength && topicForm.name.$dirty">Topic must be at least 3 characters</span>
<span ng-show="topicForm.name.$error.maxlength && topicForm.name.$dirty">Topic must be less than 15 characters</span>
<input type="submit" class="btn orange darken-1 right" ng-class="{'disabled': topicForm.$invalid, 'waves-effect waves-light': topicForm.$valid}" value="Add Topic" ng-disabled="topicForm.$invalid">
</div>
</form>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment