Anton Lyhin
Anton Lyhin

Reputation: 1945

What is the simplest way to turn off three-state column sorting?

What is the simplest way to turn off three-state column sorting for angular UI grid? The third 'unknown' state is very confusing.

UI-grid sortings example: http://ui-grid.info/docs/#/tutorial/102_sorting by default has three sorting states. What I need is to have one column in a default sorting state (ASC or DESC). On click event ui-grid should result into ASC or DESC state, but not the third one "Undefined".

This is UI Grid v3.1.0

Upvotes: 1

Views: 1170

Answers (2)

Maneesh
Maneesh

Reputation: 1

Used sortDirectionCycle: [uiGridConstants.ASC, uiGridConstants.DESC] to each column worked fine...

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

app.controller('MainCtrl', ['$scope', '$http',  'uiGridConstants', function ($scope, $http, uiGridConstants) {
$scope.gridOptions = {
enableSorting: true,
enableColumnMenus : false, 
columnDefs: [
            { field: 'name', width: '33%', minWidth: 150, width: 250,sortDirectionCycle: [uiGridConstants.ASC, uiGridConstants.DESC]},
            { field: 'gender', width: '33%', maxWidth: 200, minWidth: 70,sortDirectionCycle: [uiGridConstants.ASC, uiGridConstants.DESC] },
            { field: 'company', width: '33%',sortDirectionCycle: [uiGridConstants.ASC, uiGridConstants.DESC] }
            ]
        };

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

Upvotes: 0

Anton Lyhin
Anton Lyhin

Reputation: 1945

Grid UI v3.1.0 can set sortDirectionCycle for each column separately:

$scope.GridOptions.columnDefs: [{
      sortDirectionCycle: [uiGridConstants.ASC, uiGridConstants.DESC]
   },
   { sortDirectionCycle: [uiGridConstants.ASC, uiGridConstants.DESC] }, 
   { sortDirectionCycle: [uiGridConstants.ASC, uiGridConstants.DESC] },
   //... for each
];

Upvotes: 1

Related Questions