diff --git a/smash/web/api_urls.py b/smash/web/api_urls.py
index bea229e7e83cac748321f66a1774d4b60c8c3327..67379b2ebd2302f67347ca7c3577e02d886bbe3a 100644
--- a/smash/web/api_urls.py
+++ b/smash/web/api_urls.py
@@ -53,8 +53,10 @@ urlpatterns = [
     # worker data
     url(r'^specializations$', worker.specializations, name='web.api.specializations'),
     url(r'^units$', worker.units, name='web.api.units'),
-    url(r'^workers$', worker.workers_for_daily_planning, name='web.api.workers'),
-    url(r'^workers/availabilities$', worker.availabilities, name='web.api.workers.availabilities$'),
+
+    url(r'^daily_planning/workers/$', worker.workers_for_daily_planning, name='web.api.workers.daily_planning'),
+    url(r'^daily_planning/workers/availabilities$', worker.availabilities,
+        name='web.api.workers.daily_planning.availabilities$'),
 
     # daily planning events
     url(r'^events/(?P<date>\d{4}-\d{2}-\d{2})/$', daily_planning.events, name='web.api.events'),
diff --git a/smash/web/templates/appointments/index.html b/smash/web/templates/appointments/index.html
index f7edcc999350542ff409a3ed620a3f6982a9fdaa..ee4b4f0c9bef0184c7192368d76fd369713f1f6f 100644
--- a/smash/web/templates/appointments/index.html
+++ b/smash/web/templates/appointments/index.html
@@ -157,7 +157,7 @@
                 events: get_calendar_events_function(
                     "{% url 'web.api.appointments' full_list %}",
                     true, dayHeaders,
-                    "{% url 'web.api.workers.availabilities$' %}")
+                    "{% url 'web.api.workers.daily_planning.availabilities$' %}")
             });
         });
     </script>
diff --git a/smash/web/templates/daily_planning.html b/smash/web/templates/daily_planning.html
index 6054dcf172570251632ad338f0010d9e61355803..c02b5d7d6e7e9262b53a20f90b1eb9c4d4a261d9 100644
--- a/smash/web/templates/daily_planning.html
+++ b/smash/web/templates/daily_planning.html
@@ -46,7 +46,7 @@
     <script src="{% static 'fullcalendar-scheduler/lib/fullcalendar.min.js' %}"></script>
     <script src="{% static 'fullcalendar-scheduler/scheduler.min.js' %}"></script>
     <script>
-        var resources_url = '{% url 'web.api.workers' %}';
+        var resources_url = '{% url 'web.api.workers.daily_planning' %}';
         var events_url = '{% url 'web.api.events_persist' %}';
     </script>
     {% include "includes/datepicker.js.html" %}
diff --git a/smash/web/templates/vouchers/list.html b/smash/web/templates/vouchers/list.html
index 1b29b2965c072b85dd28d1342adb9417809791fa..134eff6c6cb8a9683d7f1be6e830cc027c9982f5 100644
--- a/smash/web/templates/vouchers/list.html
+++ b/smash/web/templates/vouchers/list.html
@@ -18,39 +18,47 @@
 {% block maincontent %}
 
     <div class="box-body">
-        <table id="table" class="table table-bordered table-striped">
-            <thead>
-            <tr>
-                <th>Number</th>
-                <th>Type</th>
-                <th>First name</th>
-                <th>Last name</th>
-                <th>Issue date</th>
-                <th>Expiry date</th>
-                <th>Status</th>
-                <th>Partner</th>
-                <th>Feedback</th>
-                <th>Edit</th>
-            </tr>
-            </thead>
-            <tbody>
-            {% for voucher in vouchers %}
-                <tr>
-                    <td>{{ voucher.number }}</td>
-                    <td>{{ voucher.voucher_type }}</td>
-                    <td>{{ voucher.study_subject.subject.first_name }}</td>
-                    <td>{{ voucher.study_subject.subject.last_name }}</td>
-                    <td>{{ voucher.issue_date }}</td>
-                    <td>{{ voucher.expiry_date }}</td>
-                    <td>{{ voucher.status }}</td>
-                    <td>{{ voucher.usage_partner.first_name }} {{ voucher.usage_partner.last_name }}</td>
-                    <td>{{ voucher.feedback }}</td>
-                    <td><a href="{% url 'web.views.voucher_edit' voucher.id %}"><i class="fa fa-edit"></i></a></td>
-                </tr>
-            {% endfor %}
-            </tbody>
+        <table id="table" class="table table-bordered table-striped table-responsive">
         </table>
     </div>
+    <h3>Visible columns</h3>
+    <div id="visible-column-checkboxes" style="display:table; width:100%">
+    </div>
+
+{#    <div class="box-body">#}
+{#        <table id="table" class="table table-bordered table-striped">#}
+{#            <thead>#}
+{#            <tr>#}
+{#                <th>Number</th>#}
+{#                <th>Type</th>#}
+{#                <th>First name</th>#}
+{#                <th>Last name</th>#}
+{#                <th>Issue date</th>#}
+{#                <th>Expiry date</th>#}
+{#                <th>Status</th>#}
+{#                <th>Partner</th>#}
+{#                <th>Feedback</th>#}
+{#                <th>Edit</th>#}
+{#            </tr>#}
+{#            </thead>#}
+{#            <tbody>#}
+{#            {% for voucher in vouchers %}#}
+{#                <tr>#}
+{#                    <td>{{ voucher.number }}</td>#}
+{#                    <td>{{ voucher.voucher_type }}</td>#}
+{#                    <td>{{ voucher.study_subject.subject.first_name }}</td>#}
+{#                    <td>{{ voucher.study_subject.subject.last_name }}</td>#}
+{#                    <td>{{ voucher.issue_date }}</td>#}
+{#                    <td>{{ voucher.expiry_date }}</td>#}
+{#                    <td>{{ voucher.status }}</td>#}
+{#                    <td>{{ voucher.usage_partner.first_name }} {{ voucher.usage_partner.last_name }}</td>#}
+{#                    <td>{{ voucher.feedback }}</td>#}
+{#                    <td><a href="{% url 'web.views.voucher_edit' voucher.id %}"><i class="fa fa-edit"></i></a></td>#}
+{#                </tr>#}
+{#            {% endfor %}#}
+{#            </tbody>#}
+{#        </table>#}
+{#    </div>#}
 {% endblock maincontent %}
 
 {% block scripts %}
@@ -58,17 +66,26 @@
 
     <script src="{% static 'AdminLTE/plugins/datatables/jquery.dataTables.min.js' %}"></script>
     <script src="{% static 'AdminLTE/plugins/datatables/dataTables.bootstrap.min.js' %}"></script>
+    <script src="{% static 'js/appointment.js' %}"></script>
 
     <script>
-        $(function () {
-            $('#table').DataTable({
-                "paging": true,
-                "lengthChange": false,
-                "searching": true,
-                "ordering": true,
-                "info": true,
-                "autoWidth": false
-            });
+        function getVoucherEditUrl(id) {
+            return "{% url 'web.views.voucher_edit' 1234567 %}".replace(/1234567/, id);
+        }
+
+        $.get("{% url 'web.api.vouchers.columns' %}", function (data) {
+            createAppointmentsTable({
+                appointment_types_url: "{% url 'web.api.appointment_types' %}",
+                subject_types_url: "{% url 'web.api.subject_types' %}",
+                locations_url: "{% url 'web.api.locations' %}",
+                subjects_url: "{% url 'web.api.vouchers'%}",
+                voucher_types_url: "{% url 'web.api.voucher_types' %}",
+                flying_teams_url: "{% url 'web.api.flying_teams' %}",
+                tableElement: document.getElementById("table"),
+                columns: getColumns(data.columns, getVoucherEditUrl),
+                checkboxesElement: document.getElementById("visible-column-checkboxes")
+            })
         });
+
     </script>
 {% endblock scripts %}
diff --git a/smash/web/tests/api_views/test_worker.py b/smash/web/tests/api_views/test_worker.py
index 22b8e76eec524117da068ee506cc020ff8bf569f..bc245f0d432e478a0d3763b2e8d37d373ea4a114 100644
--- a/smash/web/tests/api_views/test_worker.py
+++ b/smash/web/tests/api_views/test_worker.py
@@ -48,7 +48,7 @@ class TestWorkerApi(LoggedInWithWorkerTestCase):
         self.assertTrue(unit_name in units)
 
     def test_workers_for_daily_planning(self):
-        response = self.client.get(reverse('web.api.workers'))
+        response = self.client.get(reverse('web.api.workers.daily_planning'))
         self.assertEqual(response.status_code, 200)
         self.assertTrue(self.worker.first_name in response.content)