AngularJS将表单发布到外部URL

时间:2014-04-24 18:04:46

标签: angularjs

我的AngularJS应用程序中包含以下表单,其中包含基于用户在表单上的某些输入上选择的值填充的隐藏字段(单选按钮等),当用户单击提交链接时我应该路由用户在传递隐藏字段时使用外部URL,就像正常表单提交一样。不幸的是我不能这样做,因为一些隐藏的字段值依赖于视图相关控制器的函数内部的一些计算(如下面的控制器代码所示,所以我想知道有没有办法可以调用控制器函数来自这个表格,然后控制器功能发布整个表格及其字段?任何例子都非常感谢。谢谢。

注意我使用的是链接而不是按钮。

   <form name="clientPaymentForm" id="clientPaymentForm" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">>
      <div>
        <fieldset>
          <input id="name" type="text" required placeholder="Client Name" ng-model="client.name">
          ...
          ...
          <input type="hidden" name="amount" ng-value="order.total">
          ...
          ...
          <a class="orderButton" href="javascript:{}" onclick="document.getElementById('clientPaymentForm').submit(); return false;">Order Now</a>
        </fieldset>              

      </div>

     </form>

控制器:

$scope.processOrder = function(){
  //Order calculation happens here to update order.total value and can only happen after click click Order Now to place the order...
};

1 个答案:

答案 0 :(得分:0)

我想这有点晚了,但你想要使用的是ng-click指令,它允许你调用直接在作用域上定义的函数。

假设您已定义$ scope.processOrder,请将您的标记更改为以下内容:

<a class="orderButton" ng-click="processOrder()">Order Now</a>

一切都应该像希望的那样工作。

或者,您可以在表单上使用ng-submit使其按下“Enter”或“Return”键,如下所示:

<form name="clientPaymentForm" id="clientPaymentForm" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top" ng-click="processOrder()">.