xp-dev.com Git - YouAndWeb_TwoToc/blob - client/app/account/signup/signup.html

   1 <navbar></navbar>
   2
   3 <div class="container main-container">
   4   <div class="row bg-grey">
   5     <div class="col-sm-12">
   6       <h1>{{ 'SIGNUP' | translate }}</h1>
   7     </div>
   8     <form class="form" name="form" ng-submit="register(form)" novalidate>
   9       <div class="col-sm-6">
  10
  11         <br>
  12         <div class="form-group" ng-class="{ 'has-success': form.firstname.$valid && submitted,'has-error': form.firstname.$invalid && submitted }">
  13           <label>{{ 'NOME' | translate }}</label>
  14
  15           <input type="text" name="firstname" class="form-control" ng-model="user.firstName" required/>
  16           <p class="help-block" ng-show="form.firstname.$error.required && submitted">
  17             {{ 'NOME_REQUIRED' | translate }}
  18           </p>
  19         </div>
  20
  21         <div class="form-group" ng-class="{ 'has-success': form.lastname.$valid && submitted, 'has-error': form.lastname.$invalid && submitted }">
  22           <label>{{ 'COGNOME' | translate }}</label>
  23
  24           <input type="text" name="lastname" class="form-control" ng-model="user.lastName" required/>
  25           <p class="help-block" ng-show="form.lastname.$error.required && submitted">
  26             {{ 'COGNOME_REQUIRED' | translate }}
  27           </p>
  28         </div>
  29
  30         <div class="form-group" ng-class="{ 'has-success': form.birthDate.$valid && submitted, 'has-error': form.birthDate.$invalid && submitted }">
  31           <label>{{ 'DATA_NASCITA' | translate }}</label>
  32
  33           <div class="input-group">
  34             <div class="input-group datepicker-group">
  35               <input type="text" class="form-control" style="background: #FFF;"
  36               name="birthDate"
  37               ng-model="user.birthDate"
  38               datepicker-popup="dd-MM-yyyy"
  39               is-open="datepickers.birthDate"
  40               datepicker-options="dateOptions"
  41               ng-readonly="true"
  42               ng-required="true"
  43               ng-click="open($event,'birthDate')">
  44               <span class="input-group-btn">
  45                 <button class="btn btn-default" ng-click="open($event,'birthDate')"><i class="glyphicon glyphicon-calendar"></i></button>
  46               </span>
  47             </div>
  48           </div>
  49           <p class="help-block" ng-show="form.birthDate.$error.required && submitted">
  50             {{ 'DATA_NASCITA_REQUIRED' | translate }}
  51           </p>
  52         </div>
  53
  54
  55       </div>
  56
  57       <div class="col-sm-6">
  58
  59         <br>
  60
  61         <div class="form-group" ng-class="{ 'has-success': form.email.$valid && submitted, 'has-error': form.email.$invalid && submitted }">
  62           <label>{{ 'EMAIL' | translate }}</label>
  63
  64           <input type="email" name="email" class="form-control" ng-model="user.email"
  65           required
  66           mongoose-error/>
  67           <p class="help-block" ng-show="form.email.$error.email && submitted">
  68             {{ 'EMAIL_VALID' | translate }}
  69           </p>
  70           <p class="help-block" ng-show="form.email.$error.required && submitted">
  71             {{ 'EMAIL_REQUIRED' | translate }}
  72           </p>
  73           <p class="help-block" ng-show="form.email.$error.mongoose">
  74             {{ errors.email }}
  75           </p>
  76         </div>
  77
  78         <div class="form-group" ng-class="{ 'has-success': form.password.$valid && submitted, 'has-error': form.password.$invalid && submitted }">
  79           <label>{{ 'PASSWORD' | translate }}</label>
  80
  81           <input type="password" name="password" class="form-control" ng-model="user.password" ng-minlength="3" required mongoose-error/>
  82           <p class="help-block" ng-show="(form.password.$error.minlength || form.password.$error.required) && submitted">
  83             Password must be at least 3 characters.
  84           </p>
  85           <p class="help-block" ng-show="form.password.$error.mongoose">
  86             {{ errors.password }}
  87           </p>
  88         </div>
  89
  90         <div class="form-group" ng-class="{ 'has-success': form.password === form.passwordConf && submitted, 'has-error': form.password !== form.passwordConf }">
  91           <label>{{ 'CONFERMA_PASSWORD' | translate }}</label>
  92
  93           <input type="password" name="passwordConf" class="form-control" ng-model="user.passwordConf" ng-minlength="3" required/>
  94           <p class="help-block" ng-show="(user.password !== user.passwordConf || form.passwordConf.$error.minlength || form.passwordConf.$error.required) && submitted">
  95             {{ 'PASSWORD_MATCH' | translate }}
  96           </p>
  97         </div>
  98
  99         <div>
 100           <button class="btn btn-default btn-lg btn-register" type="submit">
 101             {{ 'SIGNUP' | translate }}
 102           </button>
 103           <a class="btn btn-inverse btn-lg btn-login" ui-sref="login">
 104             {{ 'LOGIN' | translate }}
 105           </a>
 106           <a class="btn btn-lg btn-facebook pull-right" href="" ng-click="loginOauth('facebook')">
 107             <i class="fa fa-facebook"></i> {{ 'ACCEDI_FACEBOOK' | translate }}
 108           </a>
 109         </div>
 110         <br>
 111       </div>
 112     </form>
 113   </div>
 114   <hr>
 115 </div>