Как отменить выбор других строк, когда выбранная строка в javascript? - PullRequest
Новая
       41

Как отменить выбор других строк, когда выбранная строка в javascript?

0 голосов
/ 11 февраля 2020

У меня есть таблица с информацией о пользователе. Я хочу выбрать одну строку (объект) и показать значок выбора, и после выбора одной строки я хочу отменить выбор другой строки (предыдущей выбранной строки). Однако, с моим кодом, строки выбора накапливаются, если не выбирать строку снова ,

Код, который я создал: 

  this.selectRow = function (row) {

  if (this.isClickable()) {
  $scope.properties.selectedRow = row;
  }
  if (row.selected === undefined)
    row.selected = false;
    row.selected = !row.selected;  

 }; 

 this.isSelected = function(row) { 
 return angular.equals(row, $scope.properties.selectedRow) ;
 };

и HTML Таблица: 

<tbody ng-if="ctrl.isArray(properties.content) && ctrl.isArray(properties.columnsKey)">
        <tr ng-repeat="row in properties.content" ng-click="ctrl.selectRow(row)" ng-class="{'info': ctrl.isSelected(row)}">
            <td>&nbsp;&nbsp;<span class="glyphicon glyphicon-ok" ng-show="row.selected"></span></td>
             <td ng-if="!properties.allowHTML" ng-repeat="column in properties.columnsKey track by $index">
                {{ $eval(column, row) | uiTranslate }}
            </td>
            <td ng-if="properties.allowHTML" ng-repeat="column in properties.columnsKey track by $index">
                <div ng-if="properties.allowHTML" ng-bind-html="$eval(column, row) | uiTranslate"></div>
            </td>
        </tr>
    </tbody>

Кажется, работает правильно, я мог бы выбрать и отменить выбор строки и значок показать, как правильно спрятаться однако мне нужно отменить выбор строки, которую я уже выбрал ранее.

Выбранный объект строки:

{"userName": "user1", "userId": "23",
"selected": true} {"userName": "user1", "userId": "23",
"selected": false}

Любая помощь будет признательна Спасибо.

1 Ответ

1 голос
/ 11 февраля 2020

Здесь я сбрасываю предыдущую выбранную строку. Я устанавливаю для его свойства значение false. 

this.selectRow = function(row) {
  // if row is already selected, deselect it.
  if (row.selected) {
    row.selected = false;
  } else {
    // find the row which was previously selected.
    const isRowSelected = $scope.properties.content.filter((item) => item.selected === true);
    if (isRowSelected.length > 0) {
      // if row found successfully, mark that row as deselected
      $scope.properties.content.filter((item) => item.selected === true)[0].selected = false;
    }
    // mark new row as selected
    row.selected = true;
  }

  if (this.isClickable()) {
    $scope.properties.selectedRow = row;
  }
  if (row.selected === undefined) {
    row.selected = false;
  }
};

this.isSelected = function(row) {
  return angular.equals(row, $scope.properties.selectedRow);
};
...