How to validate form angular with attribute in object?

Question

This is code we can validate in normal function:

<p>Username:<br>
  <input type="text" name="username" ng-model="username" required>
  <span style="color:red" ng-show="articleForm.username.$dirty && articleForm.username.$invalid">
  <span ng-show="articleForm.username.$error.required">Username is required.</span>
  </span>
</p>

But when I have title field that have code:

<header class="list-group-item-text">
  <label>Title</label>
  <input type="text" name="title" ng-model="$parent.mopost.title" class="form-control" required>
  <span class="help-inline" ng-show="articleForm.$parent.mopost.title.$error.required">Required</span>
</header>

And controller:

$scope.mopost = {title:"",content1:"",content2:"",linkaudio:""};

Now validate in Angular, it does not operate. How I can validate attribute of object same above.

It seems that there is a misplaced span tag in your first block of code... Just fyi — ezcoding
– ezcoding, Commented Dec 15, 2015 at 7:32

Sengottaian Karthik · Accepted Answer · 2015-12-15 09:35:11Z

1

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<body>

  <h2>Validation</h2>

  <form ng-app="myApp" ng-controller="demoCtrl" name="articleForm" novalidate>
    <header class="list-group-item-text">
      <label for="title">Title</label>
      <input id="title" type="text" name="user" ng-model="user" class="form-control" required>
      <span ng-show="articleForm.user.$error.required">Username is required.</span>
    </header>

    <input type="submit" ng-disabled="articleForm.user.$dirty && articleForm.user.$invalid ||  
                                          articleForm.email.$dirty && articleForm.email.$invalid">
  </form>

  <script>
    var app = angular.module('myApp', []);
    app.controller('demoCtrl', function($scope) {
      $scope.title = '';
    });
  </script>

</body>

</html>

edited Dec 15, 2015 at 9:35

answered Dec 15, 2015 at 7:43

Sengottaian Karthik

3984 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

phan ngoc Over a year ago

sorry but i have read it, it can't solve my problem, it only operate when it have attribute 1 level , same $scope.email. In my situation, it is attribute 2 level, example: $scope.mopost.title. It does not operate.

phan ngoc Over a year ago

sorry but it's not suitable for my situation

Sengottaian Karthik Over a year ago

what you want actually

phan ngoc Over a year ago

I think maybe i have described it very clearly. Important i want validate for attribute of object $scope.mopost.title (here, this is title) , your method only can apply for $scope.title.

phan ngoc Over a year ago

sorry for my noggin, reason that i don't understand clearly about angular validation and i have ask question a little stupid. Thank you for your answer. I accept it

Collectives™ on Stack Overflow

How to validate form angular with attribute in object?

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related