2016-08-05 24 views
0

我正面臨註冊表單的一個問題。 如果我登錄並且瀏覽器提供給我以保存用戶名/密碼,它們都會顯示在註冊表單中。 我試圖重置窗體,我試圖將用戶的詳細信息設置爲null,但它不起作用。 由於用戶名和密碼是預定義的,所以存在重複密碼錯誤。如何重置角度js的註冊表格

這裏是一個單元 enter image description here

註冊控制器

... 
    registerController.$inject = ['$location', 'UsersService', '$timeout']; 

    function registerController($location, UsersService, $timeout) { 
     var vm = this; 
     vm.master = {}; 
     vm.isValid = false; 
     vm.error = false; 
     vm.errorMessage = ""; 
     vm.user = { 
     username : '', 
     password : '', 
     email: '' 
     } 
     formReset(); 

     // function to submit the form after all validation has occurred 
     vm.submitForm = function(isValid) { 

     // check to make sure the form is completely valid 
     if (isValid) { 
      console.info('form valid'); 
      vm.isValid = true; 
     } 
     if(vm.isValid === true){ 
      signup(); 
     } 
     else{ 
      vm.error = true; 
      vm.errorMessage = "All fields are required"; 
     } 
     }; 

     function signup() { 
     // initial values 
     vm.error = false; 
     vm.success = false; 
     var username = vm.user.username; 
     var password = vm.user.password; 
     // call register from service 
     UsersService.register(username, password) 
      // handle success 
      .then(function() { 
      vm.success = true; 
      vm.successMessage = "Registrations successful.You'll get confirmation email soon and you can proceed with login"; 
      $timeout(function() { 
       $location.path('/login'); 
       }, 5000); 
      }) 
      // Catch error 
      .catch(function (fallback) { 
      vm.error = true; 
      vm.errorMessage = fallback; 
      }); 

     }; 
     function formReset(form){ 
     if(form === '' || form === undefined){ 
      form = vm.form; 
     } 
     if(form){ 
      form.$setPristine(); 
      form.$setUntouched(); 
      form.$setValidity(); 

     } 
     vm.contact = angular.copy(vm.master); 
     } 

    } 

玉模板

form.form-horizontal.col-md-12(name="form" role="form", data-ng-submit="ctrl.submitForm(form.$valid)", method="post" novalidate, autocomplete="off") 
     .form-group(show-errors) 
     label.control-label.col-xs-3 Username 
      span.icon-req.glyphicon.glyphicon-asterisk 
     .col-xs-9 

      input.form-control(type="text", name="username", placeholder="Enter Username", data-ng-model="ctrl.user.username", data-user-id="{{ctrl.user._id}}", data-ng-minlength="3", required="required" auth-username) 

      span.help-inline.error(data-ng-show = "form.$dirty && form.username.$error.required") Username required 
      span.help-inline.error(data-ng-show = "form.$dirty && form.username.$error.minlength") Username too short 
      span.help-inline.error(data-ng-show = "ctrl.form.username.$touched && ctrl.form.username.$error.usernameExists") Username already taken 


     .form-group(show-errors) 
     label.control-label.col-xs-3 Password 
      span.icon-req.glyphicon.glyphicon-asterisk 
     .col-xs-9 

      input.form-control(type="password", name="password", placeholder="Password", data-ng-model="ctrl.user.password", data-ng-minlength="6",ng-maxlength="16", required="required") 

      span.help-inline.error(data-ng-show = "form.$dirty && form.password.$error.required") Password required 
      span.help-inline.error(data-ng-show = "form.$dirty && form.password.$error.minlength || form.password.$error.maxlength") Password must be 6-16 character long 

     .form-group(show-errors) 
     label.control-label.col-xs-3 Repeat password 
      span.icon-req.glyphicon.glyphicon-asterisk 
     .col-xs-9 

      input.form-control(type="password", name="repeatPassword", placeholder="Repeat Password", data-ng-model="ctrl.user.repeatPassword", data-ng-minlength="4",required="required", equal-to="ctrl.user.password") 

      span.help-inline.error(data-ng-show = "form.$dirty && form.repeatPassword.$error.equalTo") Password must be equal 

     .... 

    button.btn.btn-default(type="submit") Submit 

    a(href='/') 
    button.btn.btn-primary(type="button") Cancel 

我非常新的意思堆棧發展,我我確定我錯過了一些東西。我很欣賞你我們的幫助。由於

PS:發佈的代碼是一個簡化和優化不是一個

回答

1

首先,我嘗試用HTML autocomplete屬性。但它不適用於Chrome。之後,我發現這篇文章Chrome Browser Ignoring AutoComplete=Off

禁用自動完成的解決方案之一是將輸入設置爲只讀,並在onfocus屬性中添加一些js。

onfocus="this.removeAttribute('readonly') 

我測試這個解決方案的角度形式,它的工作。 看到原來的由fizzix

+0

非常感謝,它正在工作:)只是供參考,這不僅是爲Chrome,但也爲Firefox,並且似乎足以添加只讀attr到用戶名(不需要密碼) –