1
Answer

dynamic text boxes along with check boxes

Photo of ejaz mirza

ejaz mirza
6y
498
1
am adding dynamic text boxes here now i want to add list of check boxes which are dynamically loaded in array how should i add those checkboxes to the beside that textboxes when i click new add row textboxes along with checkboxes i want
  1. <html>    
  2. <head>    
  3.     <title></title>    
  4. </head>    
  5. <body>    
  6.     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>    
  7.     <script type="text/javascript">    
  8.         var app = angular.module('MyApp', [])    
  9.         app.controller('MyController', function ($scope, $window) {    
  10.              
  11.                    $scope.Customers = [];    
  12.      
  13.             $scope.Add = function () {    
  14.                 //Add the new item to the Array.    
  15.                 var customer = {};    
  16.                 customer.Name = $scope.Name;    
  17.                 customer.Country = $scope.Country;    
  18.                 $scope.Customers.push(customer);    
  19.      
  20.                 //Clear the TextBoxes.    
  21.                 $scope.Name = "";    
  22.                 $scope.Country = "";    
  23.             };    
  24.      
  25.             $scope.Remove = function (index) {    
  26.                 //Find the record using Index from Array.    
  27.                 var name = $scope.Customers[index].Name;    
  28.                 if ($window.confirm("Do you want to delete: " + name)) {    
  29.                     //Remove the item from Array using Index.    
  30.                     $scope.Customers.splice(index, 1);    
  31.                 }    
  32.             }    
  33.         });    
  34.     </script>    
  35.     <div ng-app="MyApp" ng-controller="MyController">    
  36.         <table cellpadding="0" cellspacing="0">    
  37.             <tr>    
  38.                 <th>Name</th>    
  39.                 <th>Country</th>    
  40.                 <th></th>    
  41.             </tr>    
  42.                 
  43.             <tfoot>    
  44.                 <tr>    
  45.                     <td><input type="text" ng-model="Name" /></td>    
  46.                     <td><input type="text" ng-model="Country" /></td>    
  47.                     <td><input type="button" ng-click="Add()" value="Add" /></td>    
  48.                 </tr>    
  49.             </tfoot>    
  50.             <tbody ng-repeat="m in Customers">    
  51.                 <tr>    
  52.                     <td><input type="text" value="{{m.Name}}" /></td>    
  53.                     <td><input type="text" value="{{m.Country}}" /></td>    
  54.                     <td><input type="button" ng-click="Remove($index)" value="Remove" /></td>    
  55.                 </tr>    
  56.             </tbody>    
  57.         </table>    
  58.     </div>    
  59. </body>    
  60. </html>   

Answers (1)

Next Recommended Forum