Merge pull request #498 from yhua123/new-ui-with-sync-image

enable submit button before correct fulfil form
This commit is contained in:
kun wang 2016-07-07 22:31:27 +08:00 committed by GitHub
commit 714f72962c
3 changed files with 20 additions and 20 deletions

View File

@ -11,19 +11,19 @@
<label for="email" class="col-sm-3 control-label">// 'email' | tr //:</label> <label for="email" class="col-sm-3 control-label">// 'email' | tr //:</label>
<div class="col-sm-7"> <div class="col-sm-7">
<input type="email" class="form-control" id="email" ng-model="user.email" ng-model-options="{ debounce: 500 }" ng-change="vm.reset()" name="uEmail" required data-target="email"> <input type="email" class="form-control" id="email" ng-model="user.email" ng-model-options="{ debounce: 500 }" ng-change="vm.reset()" name="uEmail" required data-target="email">
<div class="error-message">
<div ng-messages="(form.$submitted || form.uEmail.$touched) && form.uEmail.$error">
<span ng-message="required">// 'email_is_required' | tr //</span>
<span ng-message="email">// 'email_content_illegal' | tr //</span>
</div>
<span ng-show="vm.hasError">// vm.errorMessage | tr //</span>
</div>
<p class="help-block small-size-fonts">// 'forgot_password_description' | tr //</p> <p class="help-block small-size-fonts">// 'forgot_password_description' | tr //</p>
</div> </div>
<div class="col-sm-2"> <div class="col-sm-2">
<span class="asterisk">*</span> <span class="asterisk">*</span>
</div> </div>
</div> </div>
<div class="error-message">
<div ng-messages="form.$submitted && form.uEmail.$error">
<span ng-message="required">// 'email_is_required' | tr //</span>
<span ng-message="email">// 'email_content_illegal' | tr //</span>
</div>
<span ng-show="vm.hasError">// vm.errorMessage | tr //</span>
</div>
<div class="form-group"> <div class="form-group">
<div class="col-md-offset-8 col-md-10"> <div class="col-md-offset-8 col-md-10">
<button type="submit" class="btn btn-success" ng-click="form.$valid && vm.sendMail(user)" loading-progress hide-target="false" toggle-in-progress="vm.toggleInProgress">// 'send' | tr //</button> <button type="submit" class="btn btn-success" ng-click="form.$valid && vm.sendMail(user)" loading-progress hide-target="false" toggle-in-progress="vm.toggleInProgress">// 'send' | tr //</button>

View File

@ -11,7 +11,7 @@
<label for="password" class="col-sm-3 control-label">// 'password' | tr //:</label> <label for="password" class="col-sm-3 control-label">// 'password' | tr //:</label>
<div class="col-sm-7"> <div class="col-sm-7">
<input type="password" class="form-control" id="password" ng-model="user.password" ng-change="vm.reset()" name="uPassword" ng-model-options="{ debounce: 250 }" required password> <input type="password" class="form-control" id="password" ng-model="user.password" ng-change="vm.reset()" name="uPassword" ng-model-options="{ debounce: 250 }" required password>
<div class="error-message" ng-messages="form.uPassword.$dirty && form.uPassword.$error"> <div class="error-message" ng-messages="(form.$submitted || form.uPassword.$touched) && form.uPassword.$error">
<span ng-message="required">// 'password_is_required' | tr //</span> <span ng-message="required">// 'password_is_required' | tr //</span>
<span ng-message="password">// 'password_is_invalid' | tr //</span> <span ng-message="password">// 'password_is_invalid' | tr //</span>
</div> </div>
@ -25,7 +25,7 @@
<label for="confirmPassword" class="col-sm-3 control-label">// 'confirm_password' | tr //:</label> <label for="confirmPassword" class="col-sm-3 control-label">// 'confirm_password' | tr //:</label>
<div class="col-sm-7"> <div class="col-sm-7">
<input type="password" class="form-control" id="confirmPassword" ng-model="user.confirmPassword" ng-change="vm.reset()" name="uConfirmPassword" ng-model-options="{ debounce: 250 }" compare-to="user.password"> <input type="password" class="form-control" id="confirmPassword" ng-model="user.confirmPassword" ng-change="vm.reset()" name="uConfirmPassword" ng-model-options="{ debounce: 250 }" compare-to="user.password">
<div class="error-message" ng-messages="form.uConfirmPassword.$dirty && form.uConfirmPassword.$error"> <div class="error-message" ng-messages="(form.$submitted || form.uConfirmPassword.$touched) && form.uConfirmPassword.$error">
<span ng-message="compareTo">// 'password_does_not_match' | tr //</span> <span ng-message="compareTo">// 'password_does_not_match' | tr //</span>
</div> </div>
</div> </div>
@ -35,8 +35,8 @@
</div> </div>
<div class="form-group"> <div class="form-group">
<div class="col-md-offset-7 col-md-10"> <div class="col-md-offset-7 col-md-10">
<input type="submit" class="btn btn-primary" ng-disabled="form.$invalid" ng-click="vm.resetPassword(user)" value="// 'save' | tr //"> <button type="submit" class="btn btn-primary" ng-click="form.$valid && vm.resetPassword(user)">// 'save' | tr //</button>
<input type="submit" class="btn btn-default" ng-click="vm.cancel()" value="// 'cancel' | tr //"> <button type="submit" class="btn btn-default" ng-click="vm.cancel()">// 'cancel' | tr //</button>
</div> </div>
</div> </div>
<div class="error-message"> <div class="error-message">

View File

@ -12,12 +12,12 @@
</h1> </h1>
<div class="row"> <div class="row">
<div class="col-md-12 col-md-offset-2 main-content"> <div class="col-md-12 col-md-offset-2 main-content">
<form name="form" class="form-horizontal css-form" ng-submit="form.$valid"> <form name="form" class="form-horizontal css-form" novalidate>
<div class="form-group"> <div class="form-group">
<label for="username" class="col-sm-3 control-label">// 'username' | tr //:</label> <label for="username" class="col-sm-3 control-label">// 'username' | tr //:</label>
<div class="col-sm-7"> <div class="col-sm-7">
<input type="text" class="form-control" id="username" ng-model="user.username" name="uUsername" ng-model-options="{ updateOn: 'blur' }" required maxlength="20" invalid-chars user-exists data-target="username"> <input type="text" class="form-control" id="username" ng-model="user.username" name="uUsername" ng-model-options="{ updateOn: 'blur' }" required maxlength="20" invalid-chars user-exists data-target="username">
<div class="error-message" ng-messages="form.uUsername.$error" ng-if="form.uUsername.$touched"> <div class="error-message" ng-messages="(form.$submitted || form.uUsername.$touched) && form.uUsername.$error" >
<span ng-message="required">// 'username_is_required' | tr //</span> <span ng-message="required">// 'username_is_required' | tr //</span>
<span ng-message="maxlength">// 'username_is_too_long' | tr //</span> <span ng-message="maxlength">// 'username_is_too_long' | tr //</span>
<span ng-message="invalidChars">// 'username_contains_illegal_chars' | tr //</span> <span ng-message="invalidChars">// 'username_contains_illegal_chars' | tr //</span>
@ -32,7 +32,7 @@
<label for="email" class="col-sm-3 control-label">// 'email' | tr //:</label> <label for="email" class="col-sm-3 control-label">// 'email' | tr //:</label>
<div class="col-sm-7"> <div class="col-sm-7">
<input type="email" class="form-control" id="email" ng-model="user.email" name="uEmail" ng-model-options="{ updateOn: 'blur' }" required user-exists data-target="email" maxlength="50"> <input type="email" class="form-control" id="email" ng-model="user.email" name="uEmail" ng-model-options="{ updateOn: 'blur' }" required user-exists data-target="email" maxlength="50">
<div class="error-message" ng-messages="form.uEmail.$error" ng-if="form.uEmail.$touched"> <div class="error-message" ng-messages="(form.$submitted || form.uEmail.$touched) &&form.uEmail.$error">
<span ng-message="required">// 'email_is_required' | tr //</span> <span ng-message="required">// 'email_is_required' | tr //</span>
<span ng-message="email">// 'email_content_illegal' | tr //</span> <span ng-message="email">// 'email_content_illegal' | tr //</span>
<span ng-message="userExists">// 'email_has_been_taken' | tr //</span> <span ng-message="userExists">// 'email_has_been_taken' | tr //</span>
@ -48,7 +48,7 @@
<label for="fullName" class="col-sm-3 control-label">// 'full_name' | tr //:</label> <label for="fullName" class="col-sm-3 control-label">// 'full_name' | tr //:</label>
<div class="col-sm-7"> <div class="col-sm-7">
<input type="text" class="form-control" id="fullName" ng-model="user.fullName" name="uFullName" ng-model-options="{ updateOn: 'blur' }" required maxlength="20" invalid-chars> <input type="text" class="form-control" id="fullName" ng-model="user.fullName" name="uFullName" ng-model-options="{ updateOn: 'blur' }" required maxlength="20" invalid-chars>
<div class="error-message" ng-messages="form.uFullName.$error" ng-if="form.uFullName.$touched"> <div class="error-message" ng-messages="(form.$submitted || form.uFullName.$touched) && form.uFullName.$error">
<span ng-message="required">// 'full_name_is_required' | tr //</span> <span ng-message="required">// 'full_name_is_required' | tr //</span>
<span ng-message="invalidChars">// 'full_name_contains_illegal_chars' | tr //</span> <span ng-message="invalidChars">// 'full_name_contains_illegal_chars' | tr //</span>
<span ng-message="maxlength">// 'full_name_is_too_long' | tr //</span> <span ng-message="maxlength">// 'full_name_is_too_long' | tr //</span>
@ -63,7 +63,7 @@
<label for="password" class="col-sm-3 control-label">// 'password' | tr //:</label> <label for="password" class="col-sm-3 control-label">// 'password' | tr //:</label>
<div class="col-sm-7"> <div class="col-sm-7">
<input type="password" class="form-control" id="password" ng-model="user.password" name="uPassword" ng-model-options="{ updateOn: 'blur' }" required password> <input type="password" class="form-control" id="password" ng-model="user.password" name="uPassword" ng-model-options="{ updateOn: 'blur' }" required password>
<div class="error-message" ng-messages="form.uPassword.$error" ng-if="form.uPassword.$touched"> <div class="error-message" ng-messages="(form.$submitted || form.uPassword.$touched) && form.uPassword.$error">
<span ng-message="required">// 'password_is_required' | tr //</span> <span ng-message="required">// 'password_is_required' | tr //</span>
<span ng-message="password">// 'password_is_invalid' | tr //</span> <span ng-message="password">// 'password_is_invalid' | tr //</span>
</div> </div>
@ -77,7 +77,7 @@
<label for="confirmPassword" class="col-sm-3 control-label">// 'confirm_password' | tr //:</label> <label for="confirmPassword" class="col-sm-3 control-label">// 'confirm_password' | tr //:</label>
<div class="col-sm-7"> <div class="col-sm-7">
<input type="password" class="form-control" id="confirmPassword" ng-model="user.confirmPassword" name="uConfirmPassword" ng-model-options="{ updateOn: 'blur' }" compare-to="user.password"> <input type="password" class="form-control" id="confirmPassword" ng-model="user.confirmPassword" name="uConfirmPassword" ng-model-options="{ updateOn: 'blur' }" compare-to="user.password">
<div class="error-message" ng-messages="form.uConfirmPassword.$error" ng-if="form.uConfirmPassword.$touched"> <div class="error-message" ng-messages="(form.$submitted || form.uConfirmPassword.$touched) && form.uConfirmPassword.$error">
<span ng-message="compareTo">// 'password_does_not_match' | tr //</span> <span ng-message="compareTo">// 'password_does_not_match' | tr //</span>
</div> </div>
</div> </div>
@ -89,7 +89,7 @@
<label for="comments" class="col-sm-3 control-label">// 'comments' | tr //:</label> <label for="comments" class="col-sm-3 control-label">// 'comments' | tr //:</label>
<div class="col-sm-7"> <div class="col-sm-7">
<input type="text" class="form-control" id="comments" ng-model="user.comment" name="uComments" ng-model-options="{ updateOn: 'blur' }" maxlength="20"> <input type="text" class="form-control" id="comments" ng-model="user.comment" name="uComments" ng-model-options="{ updateOn: 'blur' }" maxlength="20">
<div class="error-message" ng-messages="form.uComments.$error" ng-if="form.uComments.$touched"> <div class="error-message" ng-messages="(form.$submitted || form.uComments.$touched) && form.uComments.$error">
<span ng-show="maxlength">// 'comment_is_too_long' | tr //</span> <span ng-show="maxlength">// 'comment_is_too_long' | tr //</span>
</div> </div>
</div> </div>
@ -97,9 +97,9 @@
<div class="form-group"> <div class="form-group">
<div class="col-md-offset-8 col-md-10"> <div class="col-md-offset-8 col-md-10">
{{ if eq .AddNew true }} {{ if eq .AddNew true }}
<input type="submit" class="btn btn-success" ng-disabled="form.$invalid" ng-click="vm.signUp(user)" value="// 'add_new' | tr //"> <button type="submit" class="btn btn-success" ng-click="form.$valid && vm.signUp(user)">// 'add_new' | tr //</button>
{{ else }} {{ else }}
<input type="submit" class="btn btn-success" ng-disabled="form.$invalid" ng-click="vm.signUp(user)" value="// 'sign_up' | tr //"> <button type="submit" class="btn btn-success" ng-click="form.$valid && vm.signUp(user)">// 'sign_up' | tr //</button>
{{ end }} {{ end }}
</div> </div>
</div> </div>