[Solved] Dynamic control validation using ng-repeat not working in AngularJS

Last Reply 11 months ago By dharmendr

Posted one year ago


I am going to implement validation messages at dynamic controls

Apply Select2 directive to dynamic DropDownList using AngularJS in ASP.Net MVC

need to display validation messages at rquired fields on same line

Could you please check it and help me

I have updated my code in above url  

                    <div class="col-md-3">                        
                        <select class="form-control ApplySelect" ng-model="report.FromTable" ng-show="report.CType.toLowerCase()=='dropdown'" ng-change = "GetValue()"                                
                            ng-options="c.Value as c.Text for c in report.DDLValues" select2>
                            <option value="">Select</option>
                        <p style="color: red;display:inline" ng-show="userForm.report.FromTable.$error.required && !userForm.report.FromTable.$pristine"
                            {{report.CName}} is required.
                        <input type="date" class="form-control" ng-model="report.Date" name="report.Date" ng-show="report.CType.toLowerCase()=='datepicker'" required/>
                        <p style="color: red;display:inline" ng-show="userForm.report.Date.$error.required && !userForm.report.Date.$pristine"
                            {{report.CName}} is required.
                        <input type="text" class="form-control" ng-model="report.ValueCName" ng-show="report.CType.toLowerCase()=='textbox'" />
                        <p style="color: red;display:inline" ng-show="userForm.report.ValueCName.$error.required && !userForm.report.ValueCName.$pristine"
                            {{report.CName}} is required.


<button class="btn btn-success btn-sm" type="button" value="Save" ng-click="Save(userForm.$valid)"><span class="glyphicon glyphicon-ok">Submit</span></button>


            $scope.Save = function (isValid) {
                if (isValid) {
                    alert("Form is vaida");
                 } else {
                    $scope.mahesh = true;
                    // Show error Message if Form not valid.
                    if ($scope.userForm.$error.required != undefined) {
                        for (var i = 0; i < $scope.userForm.$error.required.length; i++) {
                            $scope.userForm.$error.required[i].$pristine = false;


Posted 11 months ago