diff --git a/dashboard/src/js/client.js b/dashboard/src/js/client.js
index cd33ea495..758c9be27 100644
--- a/dashboard/src/js/client.js
+++ b/dashboard/src/js/client.js
@@ -1336,10 +1336,10 @@ angular.module('Application').service('Client', ['$http', '$interval', 'md5', 'N
         }).error(defaultErrorHandler(callback));
     };
 
-    Client.prototype.addMailingList = function (domain, name, groupId, callback) {
+    Client.prototype.addMailingList = function (domain, name, members, callback) {
         var data = {
             name: name,
-            groupId: groupId
+            members: members
         };
 
         post('/api/v1/mail/' + domain + '/lists', data).success(function(data, status) {
@@ -1348,9 +1348,9 @@ angular.module('Application').service('Client', ['$http', '$interval', 'md5', 'N
         }).error(defaultErrorHandler(callback));
     };
 
-    Client.prototype.updateMailingList = function (domain, name, groupId, callback) {
+    Client.prototype.updateMailingList = function (domain, name, members, callback) {
         var data = {
-            groupId: groupId
+            members: members
         };
 
         post('/api/v1/mail/' + domain + '/lists/' + name, data).success(function(data, status) {
diff --git a/dashboard/src/views/email.html b/dashboard/src/views/email.html
index 433c55623..e3feb8d97 100644
--- a/dashboard/src/views/email.html
+++ b/dashboard/src/views/email.html
@@ -40,6 +40,23 @@
   </div>
 </div>
 
+<!-- Modal remove mailinglist -->
+<div class="modal fade" id="mailinglistRemoveModal" tabindex="-1" role="dialog">
+    <div class="modal-dialog">
+      <div class="modal-content">
+        <div class="modal-header">
+        </div>
+        <div class="modal-body">
+          <p>Really delete mailinglist <b>{{ mailinglists.remove.list.name }}@{{selectedDomain.domain}}</b>?</p>
+        </div>
+        <div class="modal-footer">
+          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+          <button type="button" class="btn btn-danger" ng-click="mailinglists.remove.submit()" ng-disabled="mailinglists.remove.busy"><i class="fa fa-circle-o-notch fa-spin" ng-show="mailinglist.remove.busy"></i> Delete</button>
+        </div>
+      </div>
+    </div>
+  </div>
+
 <!-- Test email sent -->
 <div class="modal fade" id="testEmailModal" tabindex="-1" role="dialog">
   <div class="modal-dialog">
@@ -184,16 +201,45 @@
   <div class="card card-large" style="margin-bottom: 15px;" ng-show="selectedDomain.mailConfig.enabled">
     <div class="row">
       <div class="col-md-12">
-        Mailinglists or forwarders are bound to user groups. Each user in a group will receive the mails sent to this group's email address.
+        Mailinglists will forward all emails to the assigned mailboxes.
       </div>
     </div>
     <br/>
-    <div class="row">
-      <div class="col-md-6">
-        <multiselect ng-model="mailinglists.groups" options="name for name in mailinglists.availableGroups" data-multiple="true"></multiselect>
-        <button class="btn btn-outline btn-primary" ng-disabled="mailinglists.busy" ng-click="mailinglists.submit()"><i class="fa fa-circle-o-notch fa-spin" ng-show="mailinglists.busy"></i> Save</button>
-      </div>
-    </div>
+    <table class="table table-hover">
+      <thead>
+        <tr>
+          <th>Name</th>
+          <th>Mailboxes</th>
+          <th class="text-right" style="width: 100px;">Action</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr ng-repeat="list in mailinglists.mailinglists">
+          <td style="vertical-align: middle;">
+            {{ list.name }}
+          </td>
+          <td>
+            <multiselect ng-model="list.members" options="name for name in mailinglists.availableMailboxNames" data-multiple="true"></multiselect>
+          </td>
+          <td class="text-right no-wrap">
+            <button ng-show="list.members !== list.orig.members" class="btn btn-success" ng-disabled="list.busy" ng-click="mailinglists.submit(list)"><i class="fa" ng-class="{ 'fa-spin': list.busy, 'fa-circle-o-notch': list.busy, 'fa-check': !list.busy }"></i></button>
+            <button class="btn btn-danger" ng-click="mailinglists.remove.show(list)"><i class="fa fa-trash"></i></button>
+          </td>
+        </tr>
+        <tr>
+          <td>
+            <input type="text" class="form-control" ng-model="mailinglists.add.name" placeholder="new list">
+            <p ng-show="mailinglists.add.error" class="text-danger"><b>{{ mailinglists.add.error }}</b></p>
+          </td>
+          <td>
+            <multiselect ng-model="mailinglists.add.members" options="name for name in mailinglists.availableMailboxNames" data-multiple="true"></multiselect>
+          </td>
+          <td class="text-right no-wrap">
+            <button class="btn btn-primary" ng-disabled="!mailinglists.add.name || !mailinglists.add.members.length || mailinglists.add.busy" ng-click="mailinglists.add.submit()"><i class="fa fa-circle-o-notch fa-spin" ng-show="mailinglists.add.busy"></i> Add</button>
+          </td>
+        </tr>
+      </tbody>
+    </table>
   </div>
 
   <div class="text-left" ng-show="selectedDomain.mailConfig.enabled">
diff --git a/dashboard/src/views/email.js b/dashboard/src/views/email.js
index 9792a42fb..2a3b31640 100644
--- a/dashboard/src/views/email.js
+++ b/dashboard/src/views/email.js
@@ -62,42 +62,94 @@ angular.module('Application').controller('EmailController', ['$scope', '$locatio
 
     $scope.mailinglists = {
         busy: false,
-        groups: [],                 // current model in the ui by name
-        availableGroups: [],        // all available groups by name
-        availableGroupsFull: [],    // all available groups full objects
-        currentGroups: [],          // currently set groups in the backend for new/removed detection
+        availableMailboxNames: [],
+        mailinglists: [],
 
-        submit: function () {
-            $scope.mailinglists.busy = true;
+        add: {
+            busy: false,
+            error: '',
+            name: '',
+            members: [],
 
-            var removedGroups = $scope.mailinglists.currentGroups.filter(function (g) { return $scope.mailinglists.groups.indexOf(g) === -1; })
-                .map(function (groupName) {
-                    return $scope.mailinglists.availableGroupsFull.find(function (g) { return g.name === groupName; });
+            submit: function () {
+                $scope.mailinglists.add.busy = true;
+
+                Client.addMailingList($scope.selectedDomain.domain, $scope.mailinglists.add.name, $scope.mailinglists.add.members, function (error) {
+                    $scope.mailinglists.add.busy = false;
+
+                    if (error) {
+                        $scope.mailinglists.add.error = error.message;
+                        console.error(error);
+                        return;
+                    }
+
+                    $scope.mailinglists.add.error = '';
+                    $scope.mailinglists.add.name = '';
+                    $scope.mailinglists.add.members = [];
+
+                    $scope.mailinglists.refresh();
                 });
-            var newGroups = $scope.mailinglists.groups.filter(function (g) { return $scope.mailinglists.currentGroups.indexOf(g) === -1; })
-                .map(function (groupName) {
-                    return $scope.mailinglists.availableGroupsFull.find(function (g) { return g.name === groupName; });
+            }
+        },
+
+        remove: {
+            busy: false,
+            list: null,
+
+            show: function (list) {
+                $scope.mailinglists.remove.list = list;
+
+                $('#mailinglistRemoveModal').modal('show');
+            },
+
+            submit: function () {
+                $scope.mailinglists.remove.busy = true;
+
+                Client.removeMailingList($scope.selectedDomain.domain, $scope.mailinglists.remove.list.name, function (error) {
+                    $scope.mailinglists.remove.busy = false;
+
+                    if (error) return console.error(error);
+
+                    $scope.mailinglists.remove.list = null;
+                    $scope.mailinglists.refresh();
+
+                    $('#mailinglistRemoveModal').modal('hide');
                 });
+            }
+        },
 
-            asyncForEach(removedGroups, function (group, callback) {
-                if (!group) return callback();
+        refresh: function () {
+            Client.getMailboxes($scope.selectedDomain.domain, function (error, result) {
+                if (error) return console.error(error);
 
-                Client.removeMailingList($scope.selectedDomain.domain, group.id, callback);
-            }, function (error) {
-                if (error) console.error('Unable to remove mailinglists.', error);
+                console.log('mailboxes', result);
 
-                asyncForEach(newGroups, function (group, callback) {
-                    if (!group) return callback();
+                $scope.mailinglists.availableMailboxNames = result.map(function (m) { return m.name; });
 
-                    Client.addMailingList($scope.selectedDomain.domain, group.id, callback);
-                }, function (error) {
-                    if (error) console.error('Unable to remove mailinglists.', error);
+                Client.listMailingLists($scope.selectedDomain.domain, function (error, result) {
+                    if (error) return console.error(error);
 
-                    // reset the state
-                    $scope.mailinglists.currentGroups = $scope.mailinglists.groups.slice();
-                    $scope.mailinglists.busy = false;
+                    console.log('lists', result);
+
+                    $scope.mailinglists.mailinglists = result.map(function (m) {
+                        m.orig = {};
+                        m.orig.members = m.members;
+
+                        return m;
+                    });
                 });
             });
+        },
+
+        submit: function (list) {
+            list.busy = true;
+
+            Client.updateMailingList($scope.selectedDomain.domain, list.name, list.members, function (error) {
+                if (error) console.error(error);
+
+                list.orig.members = list.members;
+                list.busy = false;
+            });
         }
     };
 
@@ -427,21 +479,7 @@ angular.module('Application').controller('EmailController', ['$scope', '$locatio
             $scope.selectedDomain.mailStatus = {};
 
             $scope.mailboxes.refresh();
-
-            // mailinglists/groups
-            Client.getGroups(function (error, groups) {
-                if (error) return console.error(error);
-
-                $scope.mailinglists.availableGroupsFull = groups.slice();
-                $scope.mailinglists.availableGroups = groups.map(function (u) { return u.name; });
-
-                Client.listMailingLists($scope.selectedDomain.domain, function (error, lists) {
-                    if (error) return console.error(error);
-
-                    $scope.mailinglists.groups = lists.map(function (u) { return u.name; });
-                    $scope.mailinglists.currentGroups = lists.map(function (u) { return u.name; });
-                });
-            });
+            $scope.mailinglists.refresh();
 
             // we will fetch the status without blocking the ui
             Client.getMailStatusForDomain($scope.selectedDomain.domain, function (error, mailStatus) {