--- a/client/src/components/Userdetail.vue	Fri Aug 10 11:21:58 2018 +0200
+++ b/client/src/components/Userdetail.vue	Fri Aug 10 13:15:32 2018 +0200
@@ -5,7 +5,7 @@
         {{ currentUser.user }}
       </div>
       <div class="card-body">
-        <form>
+        <form @submit.prevent="save">
           <div class="form-group">
             <label for="country">Country</label>
             <select v-model="currentUser.country">
@@ -48,11 +48,52 @@
 }
 </style>
 <script>
+import app from "../main";
+
 export default {
   name: "userdetail",
-  props: ["currentUser"],
-  data() {},
-  computed: {},
-  methods: {}
+  data() {
+    return {
+      currentUser: {},
+      path: null
+    };
+  },
+  watch: {
+    user() {
+      this.currentUser = { ...this.user };
+      this.path = this.user.name;
+    }
+  },
+  computed: {
+    user() {
+      return this.$store.getters["usermanagement/currentUser"];
+    }
+  },
+  methods: {
+    save() {
+      this.$store
+        .dispatch("usermanagement/saveCurrentUser", {
+          path: this.user.user,
+          user: this.currentUser
+        })
+        .then(() => {
+          this.$store.commit("usermanagement/clearCurrentUser");
+          this.$store.dispatch("usermanagement/loadUsers").catch(error => {
+            const { status, data } = error.response;
+            app.$toast.error({
+              title: "Backend Error",
+              message: `${status}: ${data}`
+            });
+          });
+        })
+        .catch(error => {
+          const { status, data } = error.response;
+          app.$toast.error({
+            title: "Error while saving user",
+            message: `${status}: ${data}`
+          });
+        });
+    }
+  }
 };
 </script>

--- a/client/src/stores/usermanagement.js	Fri Aug 10 11:21:58 2018 +0200
+++ b/client/src/stores/usermanagement.js	Fri Aug 10 13:15:32 2018 +0200
@@ -1,11 +1,25 @@
 import { HTTP } from "../lib/http";
 
+const newUser = () => {
+  return {
+    user: "",
+    email: "",
+    country: null,
+    role: null,
+    isNew: true
+  };
+};
+
 const UserManagement = {
   namespaced: true,
   state: {
-    users: null
+    users: null,
+    currentUser: null
   },
   getters: {
+    currentUser: state => {
+      return state.currentUser;
+    },
     users: state => {
       return state.users;
     },
@@ -18,9 +32,31 @@
   mutations: {
     usersLoaded: (state, data) => {
       state.users = data.users;
+    },
+    setCurrentUser: (state, data) => {
+      state.currentUser = data;
+    },
+    clearCurrentUser: state => {
+      state.currentUser = newUser();
     }
   },
   actions: {
+    saveCurrentUser({ commit }, data) {
+      console.log(data);
+      const { path, user } = data;
+      return new Promise((resolve, reject) => {
+        HTTP.put("/users/" + path, user, {
+          headers: { "X-Gemma-Auth": localStorage.getItem("token") }
+        })
+          .then(response => {
+            commit("usersLoaded", response.data);
+            resolve(response);
+          })
+          .catch(error => {
+            reject(error);
+          });
+      });
+    },
     loadUsers({ commit }) {
       return new Promise((resolve, reject) => {
         HTTP.get("/users", {

--- a/client/src/views/Users.vue	Fri Aug 10 11:21:58 2018 +0200
+++ b/client/src/views/Users.vue	Fri Aug 10 13:15:32 2018 +0200
@@ -33,7 +33,7 @@
             </div>
           </div>
         </div>
-        <Userdetail v-bind:currentUser="currentUser"></Userdetail>
+        <Userdetail></Userdetail>
       </div>
     </div>
   </div>
@@ -78,9 +78,7 @@
 export default {
   name: "userview",
   data() {
-    return {
-      currentUser: null
-    };
+    return {};
   },
   components: {
     Sidebar,
@@ -92,7 +90,7 @@
   methods: {
     selectUser(name) {
       const user = this.$store.getters["usermanagement/getUserByName"](name);
-      this.currentUser = user;
+      this.$store.commit("usermanagement/setCurrentUser", user);
     }
   },
   beforeRouteEnter(to, from, next) {