2

我正在使用 AngularJS,并且有一个需要向其发布数据的供应商。提交后,他们将用户重定向回我的网站。

<form method="post" action="https://api.chargify.com/api/v2/signups">
  <input type="hidden" name="secure[api_id]"    value="1234" />
  <input type="hidden" name="secure[timestamp]" value="1301148971" />
  <input type="hidden" name="secure[nonce]"     value="5b2763d0-39e1-012e-858d-64b9e8d3946e" />
  <input type="hidden" name="secure[data]"      value="one=uno&amp;two=dos" />
  <input type="hidden" name="secure[signature]" value="412951d095ebbb3800dfb2126fe5073d2ab6c260" />
</form>

有关详细信息,请参阅 Chargify 直接注册

他们没有 CORS 设置,所以我不能使用 $http 服务来发布数据。看来我必须用老式的形式来做到这一点。我遇到了角度验证和防止表单提交的问题。显然,当存在 action 属性时, angular会忽略 ng-submit 的结果。

此外,它会阻止默认操作(对于表单,这意味着将请求发送到服务器并重新加载当前页面),但前提是表单不包含操作、数据操作或 x-action 属性。

验证对于 HTML5 浏览器验证来说太复杂了,所以如果数据无效,我真的需要访问以防止表单提交。我有点坚持这一点。这似乎应该是一个容易解决的问题,但到目前为止,一个体面的解决方案已经避开了我。有没有其他人解决了这个问题,或者我错过了一些明显的东西?

我做了一个验证简化的 plunker 来演示这个问题:

http://plnkr.co/edit/p83VEFwJVbRjOoggfNpb?p=preview

4

1 回答 1

0

这感觉有点老套,但我在上面撒了一点 jQuery,直到找到更多 AngularJS 解决方案:

  $("#billingForm").submit(function(e){
    var valid = $scope.billingForm.$valid;
    if (valid) {
      return true;
    }
    else {
      e.preventDefault();
      return false;
    }
  });
于 2017-01-06T21:29:58.210 回答