when I upload the login page the button will be gray when I click on the screen the button will turn to blue focus is missing please help me with this
Html Code:
<main id="frontpage">
<form id="login-form" name="login_form" novalidate>
<div ng-class='{"input-block": true, "input-block-focus": username_focused, "input-error": login_form.username.$touched&&login_form.username.$invalid, "input-block-disabled":submit_button_value}'>
<div>
<label class="labels">Username</label>
</div>
<input class="loginForm_input" name="username" ng-model="user.username" ng-focus="username_focused=true" ng-blur="username_focused=false"
placeholder="Enter your username" type="text" ng-disabled="submit_button_value" required>
</div>
<div ng-class='{"input-block": true, "input-block-focus": password_focused, "input-error": login_form.password.$touched&&login_form.password.$invalid, "input-block-disabled":submit_button_value}'>
<div>
<label class="labels">Password</label>
</div>
<input class="loginForm_input" name="password" ng-model="user.password" ng-focus="password_focused=true" ng-blur="password_focused=false"
placeholder="Enter your password" type="{{password_type}}" ng-disabled="submit_button_value" required>
<span ng-click="showHidePassword()" ng-class='{"eye-icon-open":password_visible, "eye-icon-close":!password_visible, "pull-right": true}'></span>
</div>
<div>
<button ng-class='["btn", "btn-primary", "horizontal-center", "submit-button",{"submit-button-loading": !submit_button_value }]'
ng-disabled="login_form.$invalid || submit_button_value" ng-click="signin()">
<span ng-if="!submit_button_value">Login</span>
<span ng-if="submit_button_value" class="fa fa-spinner fa-spin"></span>
</button>
</div>
</form>
</main>
As the classes "btn", "btn-primary", "horizontal-center", "submit-button" are common, try the following:
<button class="btn btn-primary horizontal-center submit-button" ng-class="{'submit-button-loading': !submit_button_value }"
ng-disabled="login_form.$invalid || submit_button_value" ng-click="signin()">
Related
Some time post request takes query string i.e localhost/?password=123456 Don't know why do we need to add button type="button" or type="submit" please suggest thanks
<form name="login" novalidate>
<div class="row">
<input type="text" required name="email" id="username" ng-model="email" class="with-border" autofocus=true auto-focus>
</div>
<div>
<input type="password" required name="password" id="password" ng-model="password" class="with-border" >
</div>
<a class="pull-left recover-password f-pass-valign" href="#!/forgotpassword">Forgot password?</a>
<div class="form-group">
<button ng-click="login(user.email, password)" type="button" class="btn btn-danger">Login</button>
</div>
</form>
<form name="login" novalidate method="post">
<div class="row">
<input type="text" required name="email" id="username" ng-model="email" class="with-border" autofocus=true auto-focus>
</div>
<div>
<input type="password" required name="password" id="password" ng-model="password" class="with-border" >
</div>
<a class="pull-left recover-password f-pass-valign" href="#!/forgotpassword">Forgot password?</a>
<div class="form-group">
<button ng-click="login(user.email, password)" class="btn btn-danger">Login</button>
</div>
</form>
use method as post if you setup button type button then it will work on button click only
When I reload the browser and show login page. Two input field for username and password are autofill with chrome.
But the login button is greyout and show "not allowed" cursor when hover on.
If I click anywhere in the page, the login button will be enable.
Here is my code for login form:
<form name="form">
<div class="form-group">
<input type="email" id="login-email" class="form-control"
name="email"
ng-model="vm.data.email"
required
placeholder="Email Address">
</div>
<div class="form-group">
<input type="password" id="login-password" class="form-control"
name="password"
ng-model="vm.data.password"
required
placeholder="Password">
</div>
<div class="form-group">
<button type="submit" class="btn btn-rectangle btn-primary"
ng-click="vm.submit()"
ng-disabled="form.$invalid">Sign in
</button>
</div>
</form>
You may try autocomplete false.
<form name="form">
<div class="form-group">
<input type="email" id="login-email" class="form-control"
name="email"
ng-model="vm.data.email"
required
placeholder="Email Address" autocomplete="false">
</div>
<div class="form-group">
<input type="password" id="login-password" class="form-control"
name="password"
ng-model="vm.data.password"
required
placeholder="Password" autocomplete="false">
</div>
<div class="form-group">
<button type="submit" class="btn btn-rectangle btn-primary"
ng-click="vm.submit()"
ng-disabled="form.$invalid">Sign in
</button>
</div>
HI all i am new in angularjs please someone tell where i am wrong with this code my html is here :
<div class="form">
<div id="signup">
<h1>Welcome Back!</h1>
<form action="/" name="loginForm" method="post" ng-submit="sendLoginData()>
<div class="field-wrap">
<input type="email"required autocomplete="off" name="userEmail" ng-model="user.name" placeholder="E-mail" required/>
<p ng-show="loginForm.userEmail.$error.required">Please Enter Your E-mail</p>
</div>
<div class="field-wrap">
<input type="password"required autocomplete="off" name="userPassword" ng-model="user.password" placeholder="Password" required/>
<p ng-show="loginForm.userPassword.$error.required">Please Enter Your Password</p>
</div>
<span class="forgot">Sign up</span>
<p class="forgot">Forgot Password?</p>
<input type="submit" class="button button-block" ng-disabled="loginForm.$invalid" value="Log IN"/>
</form>
</div>
</div>
You can replace your code with this
<div class="form">
<div id="signup">
<h1>Welcome Back!</h1>
<form action="/" name="loginForm" method="post" ng-submit="sendLoginData()">
<div class="field-wrap">
<input type="email"required autocomplete="off" name="userEmail" ng-model="user.name" placeholder="E-mail" required/>
<p ng-show="loginForm.userEmail.$touched && loginForm.userEmail.$error.required">Please Enter Your E-mail</p>
</div>
<div class="field-wrap">
<input type="password"required autocomplete="off" name="userPassword" ng-model="user.password" placeholder="Password" required/>
<p ng-show="loginForm.userPassword.$touched && loginForm.userPassword.$error.required">Please Enter Your Password</p>
</div>
<span class="forgot">Sign up</span>
<p class="forgot">Forgot Password?</p>
<input type="submit" class="button button-block" ng-disabled="loginForm.$invalid" value="Log IN"/>
</form>
</div>
</div>
So for some reason I am only getting the password on click. I've tried moving the div around. I used a div instead of a form. Been trying to figure this out. Please Help.
<div class="container">
<div class="row">
<div class="col-md-offset-5 col-md-3">
<form class="form-login">
<h4>Welcome</h4>
<input type="text" ng.model="vm.user.name" class="form-control input-sm chat-input" placeholder="username" />
</br>
<input type="text" ng-model="vm.user.password" class="form-control input-sm chat-input" placeholder="password" />
</br>
<div class="wrapper">
<span class="group-btn">
<button type="submit" ng-click="vm.authenticate(vm.user)" class="btn btn-primary btn-md">login <i class="fa fa-sign-in"></i></a>
</span>
</div>
</form>
</div>
</div>
Hya you used ng.model instead of ng-model :3
And a long day it has been indeed
I am displaying a form in a modal. But when I click on the text input field it is not allowing me to enter text. similarly unable to change/select radio buttons
But when trying with "tab" it is working.
code
<form role="form" name="basicDetails" class="form-validation">
<div class="col-sm-6 b-r">
<h3 class="m-t-none m-b font-thin">Basic Details</h3>
<div class="form-group">
<label>Email</label>
<input type="email" class="form-control" placeholder="Enter Email" ng-model="email" required>
</div>
<div class="form-group">
<label>User Name</label>
<input type="text" class="form-control" placeholder="Enter User Name" ng-model="username" ng-pattern="/^[a-zA-Z ]{1,17}$/" required>
</div>
</div>
<div class="checkbox m-t-lg">
<button type="submit" class="btn btn-sm btn-success pull-right text-uc m-t-n-xs" ng-click="ok()"><strong>UPDATE</strong></button>
<button type="submit" class="btn btn-sm btn-danger pull-right text-uc m-t-n-xs" ng-click="close()"><strong>CLOSE</strong></button>
</div>
</form>
inspect element shows
Can someone help me to trace the issue.