单击第一次后,单选按钮不会更改值

时间:2017-08-03 16:35:48

标签: javascript angularjs json

我有3个单选按钮,默认选择为YES,我有一个提交按钮。如果我选择任何一个没有按钮,那么提交按钮将被禁用。一旦每三个按钮为是,则保存按钮启用,否则禁用。

我的项目中有以下代码。

app
  .controller(
    "MainCtrl",
    function($scope, $http) {
      $scope.formModel = {
        internationalClient: 0,
        isConfidential: 0,
        isModificationLossRecog: 0,
        idenComplianceForFinDifficulty: 1,
        idenComplianceForConcession: 1,
        idenComplianceForModificationOrRefin: 1
      };

      $(".radioBtn")
        .click(
          function() {
            $("#save").attr("disabled", true);

            $scope.forbraranceJson1 = angular.toJson(
              $scope.formModel, false);
            console.log($scope.forbraranceJson1);
            var x1 = JSON.parse($scope.forbraranceJson1);

            console.log("11 " + x1.idenComplianceForModificationOrRefin);
            console.log("22 " + x1.idenComplianceForFinDifficulty);
            console.log("33 " + x1.idenComplianceForFinDifficulty);
            if (x1.idenComplianceForModificationOrRefin == 1 && x1.idenComplianceForConcession == 1 && x1.idenComplianceForFinDifficulty == 1) {
              $("#save").attr("disabled", false);
              $scope.measureCheckbomsg = "";
            } else {
              //$("#save").attr("disabled", true);
              $scope.measureCheckbomsg = "Please select all Forbearance requirements as YES";
            }
          });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
<html ng-app="App">

<body ng-controller="MainCtrl">
  <form name="theForm" novalidate="novalidate">

    <input type="radio" ng-model="formModel.isModificationLossRecog" ng-value="1">Yes
    <input type="radio" ng-model="formModel.isModificationLossRecog" ng-value="0" ng-checked="true">No


    <input type="radio" class="radioBtn" ng-model="formModel.idenComplianceForFinDifficulty" ng-value="1" ng-checked="true">Yes
    <input type="radio" ng-model="formModel.idenComplianceForFinDifficulty" class="radioBtn" ng-value="0">No

    <input type="radio" ng-model="formModel.idenComplianceForConcession" ng-value="1" class="radioBtn" ng-checked="true">Yes
    <input type="radio" class="radioBtn" ng-model="formModel.idenComplianceForConcession" ng-value="0">No

    <button class="btn btn-success btn-sm" id="save" ng-click="saveRegistration(theForm.$valid)">Save</button>
  </body>
</html>

当我第一次点击任何单选按钮时,该值不会更改为1到0。如果我将第二次单击,则其值将以JSON更改。

1 个答案:

答案 0 :(得分:0)

在您的示例中,您不应使用单选按钮而是复选框。当您想要在多个值之间进行选择时,单选按钮更有用。在你的情况下,它更像是一个布尔值,所以复选框似乎是一个更好的选择。

然后在角度使用&#34; ng事件&#34;例如ng-clickng-change

<input type="checkbox" ng-model="formModel.idenComplianceForConcession" ng-click="clickedCallback"/>

就像控制器中的那样

$scope.clickedCallback = function () {
 console.log(formModel.idenComplianceForConcession);
}