0
Пожалуйста, обратитесь мой HTML форма прилагаетсяУгловой JS Набор фокусировки и требуют проверки, необходимо нажать на ссылку дважды, чтобы открыть ссылку
var app = angular.module('main_app',['ngRoute',"angucomplete-alt","ngStorage",'ui-notification','ngSanitize'])
\t \t \t .factory('myService', function() {
\t \t \t \t return {
\t \t \t \t \t say: function ($scope) {
\t \t \t \t \t \t return "Hello World";
\t \t \t \t \t }
\t \t \t \t }
\t \t \t })
\t \t \t ;
app.config(function(NotificationProvider) {
NotificationProvider.setOptions({
delay: 10000,
startTop: 20,
startRight: 10,
verticalSpacing: 20,
horizontalSpacing: 20,
positionX: 'right',
positionY: 'top'
});
});
app.controller('RegisterGuestController', function($scope,$routeParams,$http,$location,$rootScope,Notification){
\t $scope.book_id = $routeParams.id_book;
\t $scope.loginBlock = true;
\t $scope.lostPassword = false;
\t //console.log($scope.book_id);
\t $http({
\t \t url: base_url+"api_user/register_guest",
\t \t method: "GET",
\t \t params: {book_id: $scope.book_id}
\t }).success(function(data){
\t \t if(data.return_code==1){
\t \t \t $scope.bookDetails = data.data.bookDetails[0];
\t \t \t //alert ($scope.bookDetails.name);
\t \t \t $('#frm_name').focus(); \t \t \t
\t \t } else {
\t \t \t Notification.error({message: data.data.message, title: 'Error'});
\t \t }
\t }); \t
}); \t<html><head><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular.min.js"></script></head>
<body ng-cloak class="" ng-app="main_app" >
<div class="registration-page" ng-init="register_guest()" >
\t <form method="post" id="registrationForm" name="frmregisterGuest" novalidate >
\t \t <div class="row">
\t \t \t <div class="col-sm-6 ">
\t \t \t \t <div class="form-group required" ng-class="{ 'has-error' : frmregisterGuest.frm_name.$invalid && frmregisterGuest.frm_name.$touched}" >
\t \t \t \t \t <label for="txtfirstname">first_name</label> \t \t \t \t \t \t \t \t
\t \t \t \t \t <input type="text" name="frm_name" value="" id="frm_name" class="form-control" ng-blur="validate=true" ng-model="frm_name" title="Enter your first name." required ng-pattern="/^[a-zA-Z']*$/" ng-minlength="2" ng-maxlength="20">
\t \t \t \t \t <div ng-show="frmregisterGuest.frm_name.$error.pattern" class="help-block">Please enter only letters</div>
\t \t \t \t \t <div ng-show="frmregisterGuest.frm_name.$error.minlength" class="help-block">Min length of first name is 2</div>
\t \t \t \t \t <div ng-show="frmregisterGuest.frm_name.$error.maxlength" class="help-block">Min length of first name is 20</div>
\t \t \t \t \t <div ng-show="frmregisterGuest.frm_name.$touched && frmregisterGuest.frm_name.$error.required" class="help-block">Please enter first name</div> \t \t \t \t \t \t \t \t
\t \t \t \t </div>
\t \t \t </div> \t \t \t
\t \t \t
\t \t \t <div class="col-sm-6">
\t \t \t \t <div class="form-group" ng-class="{ 'has-error' : frmregisterGuest.frm_middleName.$invalid && frmregisterGuest.frm_middleName.$touched}" > \t \t \t \t \t \t \t \t \t
\t \t \t \t \t <label for="txtmiddleName">middle name</label> \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t <input type="text" name="frm_middleName" id="frm_middleName" ng-blur="validate=true" ng-model="frm_middleName" class="form-control" title="Enter your middle name." ng-pattern="/^[a-zA-Z']*$/" ng-minlength="2" ng-maxlength="20"> \t \t \t \t \t \t \t \t
\t \t \t \t \t \t <div ng-show="frmregisterGuest.frm_middleName.$error.pattern" class="help-block">Please enter only letters</div>
\t \t \t \t \t \t <div ng-show="frmregisterGuest.frm_middleName.$error.minlength" class="help-block">Min length of middle name is 2</div>
\t \t \t \t \t \t <div ng-show="frmregisterGuest.frm_middleName.$error.maxlength" class="help-block">Max length of middle name is 20</div> \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t </div>
\t \t \t </div>
\t \t </div> \t \t \t \t \t \t \t
\t \t <div class="row">
\t \t \t <div class="col-sm-6"> \t \t \t
\t \t \t \t <div class="form-group" ng-class="{ 'has-error' : frmregisterGuest.frm_lname.$invalid && frmregisterGuest.frm_lname.$touched}">
\t \t \t \t \t <label for="txtlastName">last name</label> \t \t \t \t \t \t \t \t \t
\t \t \t \t \t <input type="text" name="frm_lname" id="frm_lname" value="" class="form-control" ng-blur="validate=true" ng-model="frm_lname" title="Enter your last name." ng-pattern="/^[a-zA-Z']*$/" ng-minlength="2" ng-maxlength="20"> \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t <div ng-show="frmregisterGuest.frm_lname.$error.pattern" class="help-block">Please enter only letters</div>
\t \t \t \t \t <div ng-show="frmregisterGuest.frm_lname.$error.minlength" class="help-block">Min length of last name is 2</div>
\t \t \t \t \t <div ng-show="frmregisterGuest.frm_lname.$error.maxlength" class="help-block">Min length of last name is 20</div> \t \t \t
\t \t \t \t </div> \t
\t \t \t </div> \t \t \t \t \t \t \t \t \t
\t \t \t <div class="col-sm-6">
\t \t \t \t <div class="form-group required" ng-class="{ 'has-error' : frmregisterGuest.frm_email.$invalid && frmregisterGuest.frm_email.$touched}">
\t \t \t \t \t <label for="txtemail">email</label>
\t \t \t \t \t <input type="email" name="frm_email" id="frm_email" value="" class="form-control" title="Enter your email address." ng-blur="validate=true" ng-model="frm_email" required ng-pattern="/^[^\[email protected]][email protected][^\[email protected]]+\.[^\[email protected]]{2,}$/"> \t
\t \t \t \t \t <div ng-show="frmregisterGuest.frm_email.$touched && frmregisterGuest.frm_email.$error.required" class="help-block">Please enter eamil</div>
\t \t \t \t \t <div ng-show="frmregisterGuest.frm_email.$error.pattern" class="help-block">Please enter correct email</div> \t
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t \t <div class="row">
\t \t \t <div class="col-sm-6">
\t \t \t \t <div class="form-group required" ng-class="{ 'has-error' : frmregisterGuest.frm_password.$invalid && frmregisterGuest.frm_password.$touched}" >
\t \t \t \t \t <label for="txtpassword">password</label>
\t \t \t \t \t <input type="password" name="frm_password" id="frm_password" value="" class="form-control" title="Enter your password ." ng-blur="validate=true" ng-model="frm_password" required ng-minlength="6" ng-maxlength="10" > \t \t \t \t \t \t \t \t
\t \t \t \t \t <div ng-show="frmregisterGuest.frm_password.$touched && frmregisterGuest.frm_password.$error.required" class="help-block">Please enter password</div>
\t \t \t \t \t <div ng-show="frmregisterGuest.frm_password.$error.minlength" class="help-block">Min length of password is 2</div>
\t \t \t \t \t <div ng-show="frmregisterGuest.frm_password.$error.maxlength" class="help-block">Max length of password is 20</div>
\t \t \t \t </div>
\t \t \t </div> \t \t \t \t \t \t \t \t
\t \t \t <div class="col-sm-6">
\t \t \t \t <div class="form-group required" ng-class="{ 'has-error' : frmregisterGuest.frm_password2.$invalid && frmregisterGuest.frm_password2.$touched}">
\t \t \t \t \t <label for="txtpassword2">confirm password</label>
\t \t \t \t \t <input type="password" name="frm_password2" id="frm_password2" class="form-control" title="Enter your confirm_password." ng-model="frm_password2" required> \t \t
\t \t \t \t \t <div ng-show="frmregisterGuest.frm_password2.$touched && frmregisterGuest.frm_password2.$error.required" class="help-block">Please enter confirm password</div>
\t \t \t \t \t <div ng-show="(!frmregisterGuest.frm_password2.$error.required) && frmregisterGuest.frm_password2.$touched && frmregisterGuest.frm_password2.$error.noMatch" class="help-block">password does not match</div>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div> \t \t \t \t \t \t \t
\t \t <div class="clearfix"></div>
\t \t <div class="col-sm-5 col-sm-offset-1">
\t \t \t <div class="form-group">
\t \t \t \t <p class="lostpassword">
\t \t \t \t \t <a href="javascript:void(0)" ng-click="showBlock(1);">lost your password</a>
\t \t \t \t \t or
\t \t \t \t \t <a href="user/logout">already registered</a>
\t \t \t \t </p>
\t \t \t </div>
\t \t </div> \t
\t \t
\t \t <div class="col-sm-6">
\t \t \t <div class="form-group">
\t \t \t \t <input type="hidden" id="bookId" name="bookId" ng-value="{{bookDetails.id_book}}" value="{{bookDetails.id_book}}"> \t \t \t \t \t
\t \t \t \t <input type="button" ng-click="doRegister()" id="register" name="register" value="Register" class="btn btn-primary" ng-disabled="frmregisterGuest.$invalid" > \t \t \t \t \t \t \t \t
\t \t \t </div>
\t \t </div> \t \t \t \t \t \t \t
\t </form>
</div></body></html>Я устанавливаю фокус на первое поле, используя следующий код в функции register_guest() JS: $ ('# frm_name'). focus();
Форма работает отлично Когда я не использую focus().
Но, установив фокус на первое поле, когда я нажимаю ссылку «уже зарегистрирован», он отображает «обязательное полевое сообщение об ошибке» и не перенаправляет. Когда я нажимаю второй раз по той же ссылке, он перенаправляется на требуемую страницу.
Я использую JQuery версии JQuery-1.12.4 и AngularJS v1.4.1 [введите описание изображения здесь] [1]