2

I am using AngularJS v1.3.15 for form validation within Yii dynamic form but it seems angular validation works on input names. the problem is that name of inputs are in array format such as: name="LoginForm[username]". i am copying my code here:

   <div class="col-md-4 col-md-offset-4 m-t-lg" ng-app="validationApp" ng-controller="mainController">
            <section class="panel">
                <header class="panel-heading text-center"><strong>Admin Sign in </strong> </header>
                <?php 
                        $form=$this->beginWidget('CActiveForm', array(
                            'id'=>'formLogin',
                            'htmlOptions'=> array('name'=>'userForm', 'class'=>'panel-body', 'ng-submit'=>'submitForm($event)', 'novalidate'=>'true'),
                            'action'=>'#',
                            'enableAjaxValidation'=>false,
                        )); 
                    ?>
                    <div class="form-group" ng-class="{'has-error' :  userForm.username.$invalid && !userForm.username.$pristine}">
                        <label class="control-label">Email</label> 
                        <?php echo $form->emailField($model, 'username', array('placeholder'=>'[email protected]', 'class'=>'form-control', 'ng-model'=>'user.username', 'ng-pattern'=>"/^[_a-z0-9]+(\.[_a-z0-9]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,4})$/", 'required'=>'true', 'id'=>'username')); ?>
                        <?php echo $form->error($model,'username'); ?>
                    </div>
                    <div class="form-group" ng-class="{'has-error' :  userForm.password.$invalid && !userForm.password.$pristine}">
                        <label class="control-label">Password</label> 
                        <input type="password" placeholder="Password" ng-minlength="6" class="form-control" name="password" ng-model="user.password" required>
                    </div>
                    <div class="checkbox">
                        <label> <input type="checkbox"> Keep me logged in
                        </label>
                    </div>
                    <button type="submit" class="btn btn-info" ng-disabled="userForm.$invalid">Sign in</button>
                <?php $this->endwidget(); ?>
            </section>
        </div>
    </div>

And here is script code for angular controller:

      var app = angular.module('validationApp',[]);
         app.controller('mainController', function($scope) {
            $scope.submitForm = function($event){
            if ($scope.userForm.$valid){
                $scope.submit();
            } else $event.preventDefault();
         } 
      });

it works fine if i change names of input as a single word such as "username" and "password" but its not working in current situation with having name "LoginForm[username]". its working fine with password field because its plain name but same is not true with username field.

1
  • Can you show the code of generated form? Commented May 19, 2015 at 11:36

1 Answer 1

1

Have a look at these links:

Seems like you have to validate each of the fields separately after escaping them.

AngularJS validation and field name with square brackets

https://github.com/angular/angular.js/issues/1201

Field name with square brackets, can't validate

validate input with name containing brackets in AngularJS

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

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.