diff --git a/angular_app/event-info.html b/angular_app/event-info.html
index 428affe..99cfd1e 100644
--- a/angular_app/event-info.html
+++ b/angular_app/event-info.html
@@ -50,7 +50,7 @@
                             </thead>
                             <tbody>
                                 <tr ng-repeat="person in event.persons | splittedFilter:query | orderBy:personsOrder">
-                                    <td class="text-right">{{$index}}</td>
+                                    <td class="text-right">{{$index+1}}</td>
                                     <td>
                                         <span><strong><a ui-sref="person.info({id: person.person_id})"><span>{{person.name}}</span>&nbsp;<span>{{person.surname}}</span></a></strong></span><span ng-if="person.email">&nbsp;&lt;{{person.email}}&gt;</span>
                                         <p ng-if="person.company || person.job_title"><i ng-if="person.job_title">{{person.job_title}}</i><span ng-if="person.company && person.job_title">&nbsp;@&nbsp;</span><i ng-if="person.company">{{person.company}}</i></p>
@@ -113,12 +113,12 @@
 
                 <div class="panel panel-info table-striped top5">
                     <div class="panel-heading">{{'Unregistered persons' | translate}}</div>
-                    <div class="panel-body" style="height:200px;overflow:auto;">
+                    <div class="panel-body" style="height:200px;overflow-x:hidden;overflow-y:scroll;">
                         <table class="table table-striped table-condensed">
                             <thead>
                                 <tr>
                                     <th>{{'Person' | translate}}</th>
-                                    <th>{{'Add' | translate}}</th>
+                                    <th class="text-left">{{'Add' | translate}}</th>
                                 </tr>
                             </thead>
                             <tbody>
@@ -128,7 +128,7 @@
                                         <br />
                                         {{person.email}}
                                     </td>
-                                    <td>
+                                    <td class="text-left">
                                         <button reset-focus ng-click="fastAddPerson(person)" type="button" class="btn btn-link glyphicon glyphicon-plus-sign"></button>
                                     </td>
                                 </tr>
diff --git a/angular_app/js/controllers.js b/angular_app/js/controllers.js
index 6baa80c..5b55814 100644
--- a/angular_app/js/controllers.js
+++ b/angular_app/js/controllers.js
@@ -228,11 +228,28 @@ eventManControllers.controller('EventDetailsCtrl', ['$scope', 'Event', 'Person',
 eventManControllers.controller('PersonsListCtrl', ['$scope', 'Person', 'Setting',
     function ($scope, Person, Setting) {
         $scope.persons = Person.all();
-        $scope.personsOrderProp = 'name';
-        $scope.eventsOrderProp = '-begin-date';
+        $scope.personsOrder = ["name", "surname"];
         $scope.customFields = Setting.query({setting: 'person_custom_field',
             in_persons_list: true});
 
+        $scope.updateOrded = function(key) {
+            var new_order = [key];
+            var inv_key;
+            if (key && key[0] === '-') {
+                inv_key = key.substring(1);
+            } else {
+                inv_key = '-' + key;
+            }
+            angular.forEach($scope.personsOrder,
+                function(value, idx) {
+                    if (value !== key && value !== inv_key) {
+                        new_order.push(value)
+                    }
+                }
+            );
+            $scope.personsOrder = new_order;
+        };
+
         $scope.setAttribute = function(person, key, value) {
             var data = {_id: person._id};
             data[key] = value;
diff --git a/angular_app/persons-list.html b/angular_app/persons-list.html
index 4607c7e..2233bf5 100644
--- a/angular_app/persons-list.html
+++ b/angular_app/persons-list.html
@@ -30,34 +30,27 @@
                     <label for="query-persons">{{'Search:' | translate}}</label>
                     <input eventman-focus type="text" id="query-persons" class="form-control" placeholder="{{'Name or email' | translate}}" ng-model="query">
                 </div>
-                <div class="form-group">
-                    <label for="persons-order">{{'Sort by:' | translate}}</label>
-                    <select id="persons-order" class="form-control" ng-model="personsOrderProp">
-                        <option value="name" ng-selected="selected">{{'Name' | translate}}</option>
-                        <option value="-name" ng-selected="selected">{{'Name (descending)' | translate}}</option>
-                        <option value="surname" ng-selected="selected">{{'Surname' | translate}}</option>
-                        <option value="-surname" ng-selected="selected">{{'Surname (descending)' | translate}}</option>
-                    </select>
-                </div>
             </form>
 
             <table class="table table-striped">
                 <thead>
                     <tr>
-                        <th><strong>{{'Name' | translate}}</strong></th>
-                        <th ng-repeat="col in customFields">
-                            <strong>{{col.label | translate}}</strong>
+                        <th class="text-right">#</th>
+                        <th>{{'Person' | translate}} <a ng-click="updateOrded('name')" href=""><i class="fa fa-caret-up"></i></a>{{'Name' | translate}}<a ng-click="updateOrded('-name')" href=""><i class="fa fa-caret-down"></i></a> <a ng-click="updateOrded('surname')" href=""><i class="fa fa-caret-up"></i></a>{{'Surname' | translate}}<a ng-click="updateOrded('-surname')" href=""><i class="fa fa-caret-down"></i></a></th>
+                        <th ng-repeat="col in customFields" class="text-center">
+                            <a ng-click="updateOrded(col.key)" href=""><i class="fa fa-caret-up"></i></a>{{col.label | translate}}<a ng-click="updateOrded('-' + col.key)" href=""><i class="fa fa-caret-down"></i></a>
                         </th>
-                        <th><strong>{{'Delete' | translate}}</strong></th>
+                        <th class="text-center"><strong>{{'Delete' | translate}}</strong></th>
                     </tr>
                 </thead>
                 <tbody>
-                <tr ng-repeat="person in persons | splittedFilter:query | orderBy:personsOrderProp">
+                <tr ng-repeat="person in persons | splittedFilter:query | orderBy:personsOrder">
+                    <td class="text-right">{{$index+1}}</td>
                     <td>
                         <span><strong><a ui-sref="person.info({id: person._id})"><span>{{person.name}}</span>&nbsp;<span>{{person.surname}}</span></a></strong></span><span ng-if="person.email">&nbsp;&lt;{{person.email}}&gt;</span>
                         <p ng-if="person.company || person.job_title"><i ng-if="person.job_title">{{person.job_title}}</i><span ng-if="person.company && person.job_title">&nbsp;@&nbsp;</span><i ng-if="person.company">{{person.company}}</i></p>
                     </td>
-                    <td ng-repeat="col in customFields">
+                    <td ng-repeat="col in customFields" class="text-center">
                         <span ng-if="col.type == 'boolean'">
                             <button class="btn btn-link" ng-click="setAttribute(person, col.key, !person[col.key])"><span class="glyphicon {{(person[col.key]) && 'glyphicon-ok-sign text-success' || 'glyphicon-remove-sign text-danger'}}"></span></button>
                         </span>
@@ -65,7 +58,7 @@
                             {{person[col.key]}}
                         </span>
                     </td>
-                    <td>
+                    <td class="text-center">
                         <button ng-click="remove(person._id)" type="button" class="btn btn-link glyphicon glyphicon-trash"></button>
                     </td>
                 </tr>