Выбор нескольких флажков и присвоение значений массиву - HTML / Javascript

Question

Выбор нескольких флажков и присвоение значений массиву - HTML / Javascript

0

У меня есть модальный диалог, который показывает таблицу флажков рядом с именами. Я хочу назначить эти флажки для выбора значения этого имени (т.е. Когда я устанавливаю флажок рядом с "Джон" в таблице, я хочу, чтобы это имя было выбрано). Когда я нажимаю несколько флажков, я хочу передать это как массив в javascript.

По существу: установите флажки рядом с именем → Имена выбраны → Нажмите "ОК" в диалоговом окне → отправьте идентификатор имен в массиве на JS-код

Код HTML:

</div>
           <div class="modal-body">
                <table class="table table-striped table-hover ">
                <thead>
                    <tr>
                        <th>Select</th>
                        <th>User Name</th>                       
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="user in users" ng-hide="user.name === lic.users.name">
                        <td><input type="checkbox" ng-model="user.selected" id="userId"/></td>
                        <td>{{user.name}}</td>
                    </tr> 
                </tbody>
                </table>
           </div>
           <div class="modal-footer">
                <button type="button" class="btn btn-default btn-sm" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-primary btn-sm" ng-click="addLicUser(userId, lic.license.id)">Ok</button>
           </div>
       </div>


<div class="modal" id="add-new-lic-user">
   <div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
        <h4 class="modal-title">Add License User</h4>
        </div>
           <div class="modal-body">
                <p>Are you sure you want to add these users to this license?</p>
           </div>
           <div class="modal-footer">
                <button type="button" class="btn btn-default btn-sm" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-primary btn-sm" ng-click="processLicenseUser">Ok</button>
           </div>
       </div>
   </div>

Javascript:

 $scope.addLicenseUser = function (){
  $("#add-lic-user").modal('show');
};

  $scope.addLicUser = function (usId, licId){
  $scope.licenseId = licId;
  $scope.userIdToAdd = usId;
  $("#add-lic-user").modal('hide');
  $("#add-new-lic-user").modal('show');
    };

  $("#processLicenseUser").click(function(e){
  e.preventDefault();
  $scope.processLicenseUser();

});

$scope.processLicenseUser = function () {

  usId.forEach(function(entry){
    //
   var req = {
            method: 'POST',
            url: '/rest/v1/porta/mapping',
            headers:{
                'Content-Type': 'application/json',
                'GoverlanHeader_1': 'Yes',
                'x-access-token': $scope.authInfo.token
            },
            data: {'userId': $scope.userIdToAdd, 'licenseId': $scope.licenseId}
        };

Juan 21 март 2016, в 20:16

Источник

Теги:

javascript

html

angularjs

arrays

checkbox

2 ответа

Ещё вопросы

Maria · Answer 1 · 2016-03-21T17-25-00.000Z

"Я хочу передать это как массив в javascript".

Нет, где в вашем коде вы нажимаете щелкнутый элемент в массив.

$scope.users = [];

  $scope.checked = function() {
    $scope.user.splice(0, $scope.user.length); 
    $scope.user.push('id');
  };
});

Awakening Byte · Answer 2 · 2016-03-21T16-04-00.000Z

Вы уже привязаны к выбранному свойству каждого пользователя, вы можете сделать простой фильтр с помощью этого

$scope.processLicenseUser = function () {
  var selected_users = [];
  $scope.users.forEach(function(user) {
     if user.selected {
       selected_users.push({'userId': user.Id, 'licenseId': user.licenseId});
     }
   })

   var req = {
        method: 'POST',
        url: '/rest/v1/porta/mapping',
        headers:{
            'Content-Type': 'application/json',
            'GoverlanHeader_1': 'Yes',
            'x-access-token': $scope.authInfo.token
        },
        data: selected_users
    };