查看复选框上是否选择了多个答案

【问题标题】：Find out if there are selected more than one on Checkbox查看复选框上是否选择了多个
【发布时间】：2016-12-09 12:40:33
【问题描述】：

这就是我有一个复选框的方式，它必须是这样的，例如，当我点击我的按钮时，所以它必须知道必须有多个。所以它总的价值肯定更高。

因为它现在在我的 console.log () 中没有给出错误或成功消息。

<input type="checkbox"
        ng-checked="ItemSelected"
        name="SelectedTypes"
        value="2" />
<input type="checkbox"
        ng-checked="ItemSelected"
        name="SelectedTypes"
        value="3" />
<input type="checkbox"
        ng-checked="ItemSelected"
        name="SelectedTypes"
        value="4" />

<input type="button" class="btn btn-success" value="Næste" ng-click="UppersViewClick()" />

CreateUserInfo.js - 文件

$scope.UppersViewClick = function ()
{
    if ($scope.ItemSelected !== undefined)
    {
        if ($scope.ItemSelected.length > 1) {
            $scope.UppersViewInfo = false;
            $scope.PantsViewInfo = true;
            console.log("succes")
        }
        else
        {
            console.log("error");
        }
    }
}

所以我的目的是我应该确定我不止一个，或者只是一个价值。

【问题讨论】：

你想检查按钮点击的所有复选框吗？或者你的目的到底是什么？

标签： javascript angularjs

【解决方案1】：

你不能得到这样的复选框，因为它们都指的是同一个模型，

 $scope.records = [ { "Id": 1 }, { "Id": 2 }, { "Id": 3 } ];

演示

var app = angular.module('plunker', []);

app.controller('MyCtrl', function($scope) {
    $scope.records = [ { "Id": 1 }, { "Id": 2 }, { "Id": 3 } ];
    $scope.selected = {};
    $scope.ShowSelected = function() {
      $scope.records = $.grep($scope.records, function( record ) {
        return $scope.selected[ record.Id ];
      });
    };      
});

<!doctype html>
<html ng-app="plunker" >
<head>
  <meta charset="utf-8">
  <title>AngularJS Plunker</title>
    <link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet">
  <link rel="stylesheet" href="style.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
  <script src="https://raw.github.com/twitter/bootstrap/master/docs/assets/js/bootstrap.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js"></script>
  <script src="https://raw.github.com/angular-ui/angular-ui/master/build/angular-ui.js"></script>
  <script src="app.js"></script>
</head>
<body>
<div data-ng-controller="MyCtrl">
    <ul>
        <li data-ng-repeat="record in records">
            <input type="checkbox" ng-model="selected[record.Id]"> {{record.Id}}
        </li>
    </ul>
    <a href="javascript:;" data-ng-click="ShowSelected()">Show Selected</a>
</div>
	</body>
</html>

【讨论】：