Question

我有一个页面，其中有一个表单，命名为个人资料更新，当用户来到此页面进行任何更新他的个人资料时，他只更新1或2个字段，因此每次表单检查表单有效或然后只保存在db中，但我想保存，如果密码和确认密码字段没有更新，那么也更新他的个人资料，但是当他想要更改密码时，保存按钮将被禁用并在更新后查看验证配置文件

表示当用户仅更新名称时，该时间也会更新配置文件，并且用户也会更新密码，该时间首先检查验证，然后更新配置文件。

保存并isValid检查：

app.controller('DemoCtrl', function($scope, $http) {
 $scope.saveProfile = function(){
            if($scope.profile.$valid){
                ngProgress.start();
                user.saveProfile($scope.currentUser.details,function(response){
                    angular.copy(response,shared.data.currentUser);
                    notification.success($filter("il8n")("_ProfileUpdateMessage_"));
                    ngProgress.done();
                });
            }
        }

   $scope.isValidForm = function(){

            //if(($scope.profile.confirmpassword && $scope.profile.newpassword && $scope.profile.newpassword.$modelValue !== $scope.profile.confirmpassword.$modelValue))
            //    return true;
            if(!$scope.profile.$valid){
               if(($scope.profile.confirmpassword && $scope.profile.newpassword && $scope.profile.confirmpassword.$modelValue && $scope.profile.newpassword.$modelValue && ($scope.profile.newpassword.$modelValue.length == 0 || $scope.profile.confirmpassword.$modelValue.length == 0))){
                   return false;
               }
                if(($scope.profile.confirmpassword && $scope.profile.newpassword && $scope.profile.confirmpassword.$modelValue && $scope.profile.newpassword.$modelValue && $scope.profile.newpassword.$modelValue ===  $scope.profile.confirmpassword.$modelValue)){
                    return false;
                }
            }
            if($scope.profile.$valid && $scope.profile.$dirty)
                return false;

            if($scope.profile.newpassword.$invalid || $scope.profile.newpassword.$dirty &&  $scope.profile.confirmpassword.$invalid || $scope.profile.confirmpassword.$dirty){
                //$scope.profile.newpassword.$valid;
                //$scope.profile.confirmpassword.$valid;
                return false;
            }
            //if($scope.profile.newpassword.empty &&  $scope.profile.confirmpassword.empty ){
            //   return true;
            //}
            return true;
        }      
 });

找到plnkr here。

Answer 1

在我看来，你想要用户可以更新几个字段然后更新它们的表格吗？

关于密码更改，我认为您应该将密码更改中的配置文件信息拆分为两个单独的表单，用户可以在不更改其他数据的情况下更改密码。然后，如果用户想要更改其他用户数据（绑定到ng-model并已放入文本框），则用户更改数据并保存。

问题解决了。如果您需要，我可以尝试编辑您的插件并显示它的外观：）

普兰克 - New format

<form ng-submit="SAVE FUNCTION HERE">
      <fieldset>
        <div class="row">
          <div class="col-sm-4">
            <label class="proxima-nova nova-bold form-label">Change Password</label>
          </div>
        </div>
        <div class="row">
          <div class="col-sm-3">
            <label data-ng-class="{'state-error': profile.newpassword.$invalid && profile.newpassword.$dirty && profile.newpassword.$error.strongPassword}">
              <input type="password" class="form-control" placeholder="Enter new password" data-ng-model="currentUser.details.password" name="newpassword" data-password-check="currentUser.details.password" />
            </label>
            <div class="ng-cloak invalid" data-ng-show=" profile.newpassword.$error.strongPassword && profile.newpassword.$dirty && profile.newpassword.$invalid">
              Password should contain atleast one special character, number, uppercase letter, and atleast 8 characters.
            </div>
          </div>
          <div class="col-sm-3">
            <label data-ng-class="{'state-error': profile.confirmpassword.$dirty && currentUser.details.password != currentUser.details.password_confirmation}">
              <input type="password" class="form-control" placeholder="Confirm password" data-ng-model="currentUser.details.password_confirmation" name="confirmpassword" />
            </label>
            <div class="ng-cloak invalid" data-ng-show="profile.confirmpassword.$dirty && currentUser.details.password != currentUser.details.password_confirmation">
              Passwords do not match
            </div>
          </div>
        </div>
      </fieldset>
    </form>

同样在表单字段集中，您可以添加带有type =“submit”的保存按钮，然后该按钮将调用该函数，该函数已定义为表单标记

<form ng-submit="SAVE FUNCTION HERE">

角度表单验证，跳过一些字段

1 个答案: