search user changes

Issue-ID: PORTAL-386

failed to create user with special char in login_id


Change-Id: I613daa21efed9f6f137bd817a1a8aa2f9669cee8
Signed-off-by: Kishore Reddy, Gujja (kg811t) <kishore.reddy.gujja@att.com>

2 files changed, 113 insertions, 106 deletions

diff --git a/ecomp-portal-FE-os/client/src/directives/search-users/search-users.controller.js b/ecomp-portal-FE-os/client/src/directives/search-users/search-users.controller.js
index c2067cc1..fc7fd7c2 100644
--- a/ecomp-portal-FE-os/client/src/directives/search-users/search-users.controller.js
+++ b/ecomp-portal-FE-os/client/src/directives/search-users/search-users.controller.js
@@ -78,6 +78,10 @@
         		   var warningMsg = "Passwords do not match, please try again.";
         		   confirmBoxService.showInformation(warningMsg).then(isConfirmed => {return;});
         		   return;
+        	   } else if(/[^a-zA-Z0-9\-\@\_]/.test(this.newUser.loginId)){
+        		   var warningMsg = "Login ID should not contain special characters except '@', '-', and '_'.";
+        		   confirmBoxService.showInformation(warningMsg).then(isConfirmed => {return;});
+        		   return;
         	   }
         	   else {
         		   // check password length complexity.
diff --git a/ecomp-portal-FE-os/client/src/directives/search-users/search-users.tpl.html b/ecomp-portal-FE-os/client/src/directives/search-users/search-users.tpl.html
index d8a476d2..ff8d86ec 100644
--- a/ecomp-portal-FE-os/client/src/directives/search-users/search-users.tpl.html
+++ b/ecomp-portal-FE-os/client/src/directives/search-users/search-users.tpl.html
@@ -36,126 +36,129 @@
   
   -->
 <div class="search-users-directive">
-    <form name="searchUsersForm" novalidate method="post">
-        <div class="title" ng-bind="searchUsers.searchTitle"></div>
-        <div class="main">
-           <div ng-show="searchUsers.showSearch">
-	            <div class="search-instructions">Enter first name, last name or User ID</div>
-	            <div class="search">
-	                <input id="input-user-search"
-	                       autocomplete="off"
-	                       type="text"
-	                       name="searchString"
-	                       placeholder="Search"
-	                       ng-model="searchUsers.searchUserString"
-	                       ng-keyup="$event.keyCode===13 && searchUsersForm.searchString.$valid && searchUsers.searchUsers()"
-	                       pattern="[a-zA-Z0-9-_'\s]{1,}"
-	                       maxlength="80"
-	                       required="true" auto-focus tabindex="0"/>
-	               
-	               	<button class="btn btn-alt btn-small" tabindex="2" id="button-search-users"
-	               		ng-class="{disabled: searchUsersForm.searchString.$invalid || searchUsers.searchUsersInProgress}"
-	                	ng-click="searchUsersForm.searchString.$valid && searchUsers.searchUsers()">Search
-	                </button>
-	                
-	                <button class="btn btn-alt btn-small" id="Create-New-User-button" ng-click="searchUsers.showAddUserSection()">
-	                	<i class="icon-people-userbookmark" aria-hidden="true"></i>&nbsp;New User
-	                </button> 
-	                
-	            </div>
-	
-	            <span class="ecomp-spinner" ng-show="searchUsers.isLoading"></span>
-	            <div ng-show="UserSearchsIsNull===false">
-	                <div class="search-results"
-	                     ng-show="!searchUsers.isLoading
+	<form name="searchUsersForm" novalidate method="post">
+		<div class="title" ng-bind="searchUsers.searchTitle"></div>
+		<div class="main">
+			<div ng-show="searchUsers.showSearch">
+				<div class="search-instructions">Enter first name, last name
+					or User ID</div>
+				<div class="search">
+					<input id="input-user-search" autocomplete="off" type="text"
+						name="searchString" placeholder="Search"
+						ng-model="searchUsers.searchUserString"
+						ng-keyup="$event.keyCode===13 && searchUsersForm.searchString.$valid && searchUsers.searchUsers()"
+						pattern="[a-zA-Z0-9-_'\s]{1,}" maxlength="80" required="true"
+						auto-focus tabindex="0" />
+
+					<button class="btn btn-alt btn-small" tabindex="2"
+						id="button-search-users"
+						ng-class="{disabled: searchUsersForm.searchString.$invalid || searchUsers.searchUsersInProgress}"
+						ng-click="searchUsersForm.searchString.$valid && searchUsers.searchUsers()">Search
+					</button>
+
+					<button class="btn btn-alt btn-small" id="Create-New-User-button"
+						ng-click="searchUsers.showAddUserSection()">
+						<i class="icon-people-userbookmark" aria-hidden="true"></i>&nbsp;New
+						User
+					</button>
+
+				</div>
+
+				<span class="ecomp-spinner" ng-show="searchUsers.isLoading"></span>
+				<div ng-show="UserSearchsIsNull===false">
+					<div class="search-results"
+						ng-show="!searchUsers.isLoading
 	                     && searchUsers.searchUsersResults
 	                     && searchUsers.searchUsersResults.length">
-	                    <div id="search-results" ng-show="UserSearchsIsNull===false"
-	                         class="results-title"
-	                         ng-bind="'Showing ' + searchUsers.searchUsersResults.length + ' results'"></div>
-	                    <div class="results-container" scroll-top="searchUsers.scrollApi">
-	                        <div id="search-result-{{$index}}"
-	                             class="user"
-	                             ng-repeat="user in (searchUsers.searchUsersResults | orderBy:['firstName','lastName','orgUserId']) | limitTo: 100 track by $index"
-	                             ng-click="searchUsers.setSelectedUser(user)"
-	                             ng-class="{selected: user.orgUserId === searchUsers.selectedUser.orgUserId}">
-	                            <div id="main-name-{{$index}}" class="main-name">
-	                                <span id="result-first-name-{{$index}}" ng-bind="::user.firstName"></span>
-	                                <span id="result-last-name-{{$index}}"  ng-bind="::user.lastName"></span>
-	                                <span id="result-uuid-{{$index}}" ng-bind="::user.orgUserId"></span></div>
-	                            <div id="job-title-{{$index}}" class="sub-job-title" ng-bind="::user.jobTitle"></div>
-	                            <br/>
-	                        </div>
-	                    </div>
-	                </div>
-	            </div>
-	            
-	            <div class="error-text"
-	                 id="user-search-error-403"
-	                 ng-show="UserSearchsIsNull===true">
-	                No match found.
-	            </div>
-	            
-	            <div id="no-user-found"
-	                 class="no-user-found"
-	                 ng-show="searchUsers.searchUsersResults && searchUsers.searchUsersResults.length===0 && !searchUsers.searchUsersInProgress">
-	                 No users found
-	            </div>
-            </div>
+						<div id="search-results" ng-show="UserSearchsIsNull===false"
+							class="results-title"
+							ng-bind="'Showing ' + searchUsers.searchUsersResults.length + ' results'"></div>
+						<div class="results-container" scroll-top="searchUsers.scrollApi">
+							<div id="search-result-{{$index}}" class="user"
+								ng-repeat="user in (searchUsers.searchUsersResults | orderBy:['firstName','lastName','orgUserId']) | limitTo: 100 track by $index"
+								ng-click="searchUsers.setSelectedUser(user)"
+								ng-class="{selected: user.orgUserId === searchUsers.selectedUser.orgUserId}">
+								<div id="main-name-{{$index}}" class="main-name">
+									<span id="result-first-name-{{$index}}"
+										ng-bind="::user.firstName"></span> <span
+										id="result-last-name-{{$index}}" ng-bind="::user.lastName"></span>
+									<span id="result-uuid-{{$index}}" ng-bind="::user.orgUserId"></span>
+								</div>
+								<div id="job-title-{{$index}}" class="sub-job-title"
+									ng-bind="::user.jobTitle"></div>
+								<br />
+							</div>
+						</div>
+					</div>
+				</div>
+
+				<div class="error-text" id="user-search-error-403"
+					ng-show="UserSearchsIsNull===true">No match found.</div>
 
-            
-            <div id="addWidget" class="add-user-section" ng-show="searchUsers.showAddUser">
-				<div>	        
-					<div class="input-new-user-div" >
-						  <div  class="">*First Name</div>
-						  <input  type="text"  ng-model="searchUsers.newUser.firstName"/>						            
+				<div id="no-user-found" class="no-user-found"
+					ng-show="searchUsers.searchUsersResults && searchUsers.searchUsersResults.length===0 && !searchUsers.searchUsersInProgress">
+					No users found</div>
+			</div>
+
+
+			<div id="addWidget" class="add-user-section"
+				ng-show="searchUsers.showAddUser">
+				<div>
+					<div class="input-new-user-div">
+						<div class="">*First Name</div>
+						<input type="text" ng-model="searchUsers.newUser.firstName" />
 					</div>
-					<div class="input-new-user-div" >
-						  <div  class="">Middle Name</div>
-						  <input  type="text"  ng-model="searchUsers.newUser.middleName"/>						            
+					<div class="input-new-user-div">
+						<div class="">Middle Name</div>
+						<input type="text" ng-model="searchUsers.newUser.middleName" />
 					</div>
-					<div class="input-new-user-div" >
-						  <div class="">*Last Name</div>
-						  <input  type="text" ng-model="searchUsers.newUser.lastName"/>
+					<div class="input-new-user-div">
+						<div class="">*Last Name</div>
+						<input type="text" ng-model="searchUsers.newUser.lastName" />
 					</div>
-					<div class="input-new-user-div" >
-						  <div class="">*Email Address ID</div>
-						  <input  type="text" ng-model="searchUsers.newUser.emailAddress"/>
+					<div class="input-new-user-div">
+						<div class="">*Email Address ID</div>
+						<input type="text" ng-model="searchUsers.newUser.emailAddress" />
 					</div>
-					<div class="input-new-user-div" >
-						  <div class="">*Login ID</div>
-						  <input  type="text" ng-model="searchUsers.newUser.loginId"/>
+					<div class="input-new-user-div">
+						<div class="">*Login ID</div>
+						<input type="text" ng-model="searchUsers.newUser.loginId" />
 					</div>
-					<div class="input-new-user-div" >
-						  <div class="">*Login Password</div>
-						  <input  type="password" ng-model="searchUsers.newUser.loginPwd"    autocomplete="off"/>
+					<div class="input-new-user-div">
+						<div class="">*Login Password</div>
+						<input type="password" ng-model="searchUsers.newUser.loginPwd"
+							autocomplete="off" />
 					</div>
-					<div class="input-new-user-div" >
-						  <div class="">*Confirm Login Password</div>
-						  <input  type="password" ng-model="searchUsers.newUser.loginPwdCheck"  autocomplete="off"/>
+					<div class="input-new-user-div">
+						<div class="">*Confirm Login Password</div>
+						<input type="password"
+							ng-model="searchUsers.newUser.loginPwdCheck" autocomplete="off" />
 					</div>
-				<div ng-show="searchUsers.newUser.loginPwdCheck.length>=searchUsers.newUser.loginPwd.length&&searchUsers.newUser.loginPwdCheck.length>0&&searchUsers.newUser.loginPwd!=searchUsers.newUser.loginPwdCheck"
+					<div
+						ng-show="searchUsers.newUser.loginPwdCheck.length>=searchUsers.newUser.loginPwd.length&&searchUsers.newUser.loginPwdCheck.length>0&&searchUsers.newUser.loginPwd!=searchUsers.newUser.loginPwdCheck"
 						style="color: #cf2a2a; font-size: 12px;">
-						<small
-							style="position: absolute; margin-top: -6px;">The passwords do not match. Try again.
-						</small>
-	            </div>
-	            <div ng-show="userExist==true"
+						<small style="position: absolute; margin-top: -6px;">The
+							passwords do not match. Try again. </small>
+					</div>
+					<div ng-show="userExist==true"
 						style="color: #cf2a2a; font-size: 12px;">
-						<small
-							style="position: absolute; margin-top: -6px;">User with same loginId already exists. Try again.
-						</small>
-	            </div>
-				</div>
-                <div class="add-new-user-btn">
-                	<button class="btn btn-alt btn-small" ng-click="searchUsers.addNewUserFun()">Add New User</button>
+						<small style="position: absolute; margin-top: -6px;">User
+							with same loginId already exists. Try again. </small>
+					</div>
+					<div class="search-instructions">
+						<strong style="color: red">Note:</strong> Login ID should not
+						contain special characters except '@', '-', and '_'.
+					</div>
 				</div>
+				<div class="add-new-user-btn">
+					<button class="btn btn-alt btn-small"
+						ng-click="searchUsers.addNewUserFun()">Add New User</button>
 				</div>
-																		
+			</div>
 
-		    </div>
-            
-        </div>
 
-    </form>
+		</div>
+</div>
+
+</form>
 </div>