angularjs 防止色谱柱移动/重新排列

lg40wkob 于 2023-03-28 发布在 Angular

关注(0)|答案(2)|浏览(157)

我正在使用UI Grid。我有一个plnkr here

var app = angular.module('app', ['ngTouch', 'ui.grid', 'ui.grid.pinning', 'ui.grid.moveColumns']);

app.controller('MainCtrl', ['$scope', '$http', '$log', function ($scope, $http, $log) {
  $scope.gridOptions = {};

  $scope.gridOptions.columnDefs = [
    { name:'id', width:50, pinnedLeft:true  },
    { name:'name', width:100, pinnedLeft:true },
    { name:'age', width:100, pinnedLeft:true  },
    { name:'company', width:100},
    { name:'address.street', width:150  },
    { name:'address.city', width:150 },
    { name:'address.state', width:50 },
    { name:'address.zip', width:50 },
    { name:'email', width:100 },
    { name:'phone', width:200 },
    { name:'about', width:300 },
    { name:'friends[0].name', displayName:'1st friend', width:150 },
    { name:'friends[1].name', displayName:'2nd friend', width:150 },
    { name:'friends[2].name', displayName:'3rd friend', width:150 },
  ];
  $scope.gridOptions.jqueryUIDraggable= false;

  $http.get('https://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/500_complex.json')
    .success(function(data) {
      $scope.gridOptions.data = data;
    });
}]);

，我希望实现以下目标：
1.前3列被钉在左侧
1.我希望能够通过拖放来移动/重新排列其他非固定列
我做到了这两点。
但是，我无法停止/防止拖放被固定的列。我如何防止某些列被拖放？

angularjs

来源：https://stackoverflow.com/questions/36425273/prevent-column-moving-rearranging

2条答案

按热度按时间

pxy2qtax1#

在app.js中，尝试将enableColumnMoving：false添加到columnDefs中，如下所示：

var app = angular.module('app', ['ngTouch', 'ui.grid', 'ui.grid.pinning', 'ui.grid.moveColumns']);

app.controller('MainCtrl', ['$scope', '$http', '$log', function ($scope, $http, $log) {
  $scope.gridOptions = {};

$scope.gridOptions.columnDefs = [
{ name:'id', width:50, pinnedLeft:true, enableColumnMoving:false },
{ name:'name', width:100, pinnedLeft:true, enableColumnMoving:false },
{ name:'age', width:100, pinnedLeft:true, enableColumnMoving:false  },
{ name:'company', width:100},
{ name:'address.street', width:150  },
{ name:'address.city', width:150 },
{ name:'address.state', width:50 },
{ name:'address.zip', width:50 },
{ name:'email', width:100 },
{ name:'phone', width:200 },
{ name:'about', width:300 },
{ name:'friends[0].name', displayName:'1st friend', width:150 },
{ name:'friends[1].name', displayName:'2nd friend', width:150 },
{ name:'friends[2].name', displayName:'3rd friend', width:150 },
];    

$http.get('https://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/500_complex.json')
.success(function(data) {
  $scope.gridOptions.data = data;
});
}]);

赞(0）回复(0）举报 2023-03-28

j7dteeu82#

七年后更好的解决方案-在def列中suppressMovable：true。
对于所有色谱柱：
public defaultColDef：ColDef = { sortable：false，filter：}};};

赞(0）回复(0）举报 2023-03-28