基于角度 js 中的单选按钮选择的表单动作更改答案

【问题标题】：form action change based on radio button selection in angular js基于角度 js 中的单选按钮选择的表单动作更改
【发布时间】：2016-10-20 00:28:03
【问题描述】：

现在我有一个表单和两个单选按钮。根据选择的单选按钮，我必须更改表单操作。

这里是代码

 <form action={{action}} name="payform" method="post">
<div class="form-group">
<div class="radio radio-text">
<label>
<input type="radio" ng-model="cash" ng-click="paymethod('cash')" name="payment" value="cash">Cash
</label>
</div>
</div>
</div>
<div class="col-sm-12 col-md-4 col-lg-4">
<div class="form-group">
<div class="radio radio-text">
<label>
<input type="radio" ng-model="online" ng-click="paymethod('online')" name="payment" value="online">Online
</label>
</div>
</div>


<button class="btn btn-success" name="submit" type="submit">Submit</button>
</form>

这是控制器代码

$scope.paymethod = function(ptype){
alert("hi");
if(ptype=="cash"){
$scope.action = "food.php";
}
else if(ptype=="online"){
$scope.action = "online.php";
}
}

我在函数中使用了 alert 来检查函数是否被调用。并且警报正在工作，这意味着正在调用函数但是当我点击提交时没有任何反应。

【问题讨论】：

检查你是否获得了 ptype
是的，我正在获取 ptype。我通过在控制台中打印值来检查
我可以从网络选项卡中看到导航到相应的操作。您是否在控制台中看到任何错误。请检查这个小提琴的控制台和网络jsfiddle.net/vasi_32/n0pydc8k
谢谢。我有一个错误。谢谢推荐
请用您的解决方案回答自己或接受以下任何答案来结束问题。

标签： javascript jquery html angularjs forms

【解决方案1】：

不完全符合您的要求，但它解决了您的问题：

在表单字段 ng-models 前添加 formData。
将 ng-submit 添加到您的表单中
使用该函数发出 $http 请求

非常基本的例子：

HTML：

<form name="payform" ng-submit="submitForm()">
     <input ng-model="formData.value1" />
     <input ng-model="formData.value2" />
     <button type="submit"></submit>
</form>

JS：

$scope.submitForm = function submitForm() {
    $http.post($scope.ptype + '.php', $scope.formData).then(
        function success(response) {
             // do something
        },
        function error(response) {
             // not good
        }
    };

由于使用 formData 作为表单 ng-model 属性的前缀，所有字段都包含在一个对象中，您可以在发出 POST 请求时轻松使用。

【讨论】：