如何使用選擇單選按鈕的所有選項？

-2

在這裏，我使用一些單選按鈕創建了一條記錄。我需要的是當我選擇selectAll單選按鈕時，所選記錄應該出現在同一頁面中。如何使用選擇單選按鈕的所有選項？

當我取消選中記錄中的任何單選按鈕時，selectAll複選框中的黑色標記不應出現在我們用於gmail的gmail相同的示例中，其中gmail使用複選框，我正在嘗試執行此操作與單選按鈕。

-----這裏是我的index.html -------

<!DOCTYPE html> 
<html> 

    <head> 
    <script data-require="[email protected]" data-semver="1.4.0-beta.6" src="https://code.angularjs.org/1.4.0-beta.6/angular.js"></script> 
    <link href="style.css" rel="stylesheet" /> 
    <script src="script.js"></script> 
    </head> 

    <body ng-app="myApp"> 

    <span>Table One</span> 

<div ng-controller="peopleCtrl"> 
    <label> 
      <input type="radio" 
        ng-model="allChecked" 
      ng-click="checkAll()" /> Select All 
     </label> 

     <table width="400" border="1"> 
     <tr> 
      <th>check</th> 
         <th>Id</th> 
         <th>Name</th> 
         <th>Age</th>   
        </tr> 

     <tr ng-repeat="person in people"> 




       <td> 
        <input type="radio" ng-model="person.check" ng-click="changeCheckAll()" /> 
       </td>  
          <td>{{ person.id }}</td> 
          <td>{{ person.name }}</td> 
          <td>{{ person.age }}</td> 

     </tr> 
    </table> 
    <br> 
    <span>Table Two</span> 
    <table width="400" border="1"> 
     <tr> 
      <th>Id</th> 
         <th>Name</th> 
         <th>Age</th> 
      </tr> 
     <tr ng-repeat="person in people | filter: {check:true}"> 
      <td>{{person.id}}</td> 
      <td>{{person.name}}</td> 
      <td>{{person.age}}</td> 
     </tr> 
    </table> 


    </div> 

    </body> 

</html>

而且我的腳本頁面

// Code goes here 

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

myApp.controller('peopleCtrl', function($scope) { 

    $scope.people = ([{ 
    id: 1, 
    name: "Anil", 
    age: 21 
    }, { 
    id: 2, 
    name: "Niladri", 
    age: 20 
    }, { 
    id: 3, 
    name: "Venkat", 
    age: 22 
    }]); 




$scope.checkAll = function() { 
     for(var i=0; i < $scope.people.length; i++) { 
      $scope.people[i].check = $scope.allChecked; 
     } 
    }; 


    $scope.changeCheckAll = function() { 
     for(var i = 0; i < $scope.people.length; i++) { 

      if (!$scope.people[i].check) { 
       $scope.allChecked = false; 
       return false; 
      } 
     } 


     $scope.allChecked = true; 
    }; 
});

而且我plnkr：http://plnkr.co/edit/RKAdEZYvsJu5wbhIs41A?p=preview

來源

2015-05-08 anil chean

請嘗試使用拼寫檢查，也...牆的代碼 – nsij22

請使用複選框。單選按鈕是爲了在一組選項中選擇一個選項 – Pratik

我已經使用這個使用複選框，它的工作完美，但我的任務是通過使用單選按鈕來完成...... –

<div ng-controller="peopleCtrl"> 
    <label> 
      <input type="checkbox" 
        ng-model="allChecked" 
      ng-click="checkAll()" /> Select All 
     </label> 

     <table width="400" border="1"> 
     <tr> 
      <th>check</th> 
         <th>Id</th> 
         <th>Name</th> 
         <th>Age</th>   
        </tr> 

     <tr ng-repeat="person in people"> 




       <td> 
        <input type="checkbox" ng-model="person.check" ng-click="changeCheckAll()" /> 
       </td>  
          <td>{{ person.id }}</td> 
          <td>{{ person.name }}</td> 
          <td>{{ person.age }}</td> 

     </tr> 
    </table>

單選按鈕旨在用於給用戶一個選項，以在一組選項中僅選擇一個選項。您正在錯誤地使用單選按鈕。複選框在這裏完美工作！ http://plnkr.co/edit/udgGcsMTubxf4yZapm10?p=preview

來源

2015-05-08 09:51:07 Pratik

K我可以使用單選按鈕綁定顯示在表格2中的文檔的表格而不是使用全選選項 –

我沒有找到你。你想在現在有複選框的表格中使用單選按鈕嗎？ – Pratik

是的，這是我的計劃，但正如你說這是不可能的，所以我可以只綁定特定的記錄，將顯示在表中兩個 –

如何使用選擇單選按鈕的所有選項？

回答

相關問題