4

I have a following grid defined in my View

<div class="gridStyle hide" ng-grid="resultsOptions" id="resultsGrid"></div>

And I want to allow multiSelect only if a ctrl key is pressed. So I define multiSelect attribute as false in the Controller. 

$scope.resultsOptions = {
    data: 'searchData',
    selectedItems: $scope.mySelections,
    multiSelect: false,
    enableHighlighting: true,
    enableRowSelection: true
};

In the same controller I have the following code that sets multiSelect to true. 

$("#resultsGrid").keydown(function (e) {
    if (e.ctrlKey) {
        $scope.resultsOptions.multiSelect = true;
        $scope.$apply();
    }
});

When I launch the application multiSelect value changes after pressing ctrl. But I am still can not make a multiple selection.

I tried to use variable for multiSelect, but it doe not change a thing.

The following example also does not change multiSelect attribute. But it changes the grid header. http://plnkr.co/edit/RwYSG4?p=preview

Is there any simple solution? Or what do I miss in my code?

4

2 回答 2

6

批准的“hacky”答案对我们来说不够干净，所以我们构建了一个稍微更健壮的版本，依赖于事件参数 onbeforeSelectionChange而不是做讨厌的键绑定。这也适用于您添加此事件回调的任何网格，因为它不需要引用任何特定的自定义 CSS 类或 ID，而只需使用可靠的 ng-grid 类。

beforeSelectionChange: function(rowItem, event){
    if(!event.ctrlKey && !event.shiftKey && $scope.multiSelect && 
        !$(event.srcElement).is(".ngSelectionCheckbox"))
    {
          angular.forEach($scope.myData, function(data, index){
              $scope.gridOptions.selectRow(index, false);
          });
    }
    return true;
}

这样做只是检查我们是否正在执行多选操作（按住 ctrl 键、shift 键或使用多选复选框），如果是，则让多选发生。如果用户只是单击一行上的任何其他位置，并且多选处于活动状态，我们将删除所有当前选择，以便之后仅选择一个目标行。

于 2014-01-16T10:00:55.460 回答
4

由于无法即时更改某些网格选项（https://github.com/angular-ui/ng-grid/issues/386）。如果在网格的beforeSelectionChange属性中未按下 ctrl，我决定手动取消选择每个元素。

该解决方案是有效的，但它有效。

根据mabi的评论...

于 2013-10-11T12:34:16.793 回答