Question

在我的应用程序中，必须仅使用按钮验证验证码。我试过了，但是当我输入错误的验证码时，表单提交到数据库中以后警告消息显示验证码无效但表单已经提交。

如果输入错误的验证码，我想通过按钮点击验证，表单不应提交。请提前看看我的小提琴并帮我解决这个问题。

$scope.submit = function() {
  alert("hiiiiii");
  var string1 = removeSpaces($scope.mainCaptcha);
  var string2 = removeSpaces($scope.c);

  if (string1 == string2) {
    alert(true);
  } else {
    alert(false);
  }

  var _EeqObj = new Object();
  _EeqObj.Name = $("#Name").val();
  _EeqObj.Verification_Code = $("#txtInput").val();
  _EeqObj.Meth = "WX";

  var httpreq = $http({
    method: 'POST',
    url: "api/Home",
    data: _EeqObj
  }).success(function(response) {
    if (response == "success") {
      alert("Thank You");
    } else {
      alert("not inserted");
    }
  });
}

https://jsfiddle.net/6jqmv68d/2/

Answer 1

无论验证码是否正确，

submit()都会提交表单，因此当输入错误的验证码时，您需要退出/退出submit()模块并显示警告消息。

JS CODE：

if (string1 == string2) {
    alert(true);
}
else {
    alert("Wrong captcha, please re enter and submit again");
    return;
}

注意：我个人不喜欢使用angularjs的任何第三方库，因为它是一种过度杀戮，在您的情况下，而不是使用jquery使用{获取DOM数据{1}}定义模型并在控制器中引用它。

使用ng-model代替jquery DOM遍历

ng-model

Working demo @ JSFiddle

Answer 2

显示错误的验证码消息后，您需要return false，因为ng-submit不会验证任何自定义无效数据或无效字段。

if (string1 == string2) {
    alert(true);
} else {
    alert(false);
    return false;
}

使用按钮单击验证Captcha AngularJS验证

2 个答案: