diff --git a/src/js/admin-general-view.js b/src/js/admin-general-view.js
index f713a11..77de144 100644
--- a/src/js/admin-general-view.js
+++ b/src/js/admin-general-view.js
@@ -41,7 +41,6 @@ module.exports = {
       config: "",
       current_time: "",
       is_loading_time: false,
-      is_24_hr_format: false,
       selected_date: null,
       selected_hours: `${new Date().getHours()}`,
       selected_minutes: `${new Date().getMinutes()}`,
@@ -59,7 +58,7 @@ module.exports = {
 
   computed: {
     get_current_time: function () {
-      if (this.is_24_hr_format == true) {
+      if (this.config.admin.time_format == true) {
         return this.current_time;
       } else {
         const [hour, minutes, seconds] = this.current_time.split(":");
@@ -187,6 +186,16 @@ module.exports = {
       this.$dispatch("config-changed");
     },
 
+    change_time_format: async function () {
+      try {
+        this.config.admin.time_format = !this.config.admin.time_format;
+        await api.put("config/save", this.config);
+      } catch (error) {
+        console.error("Update failed:", error);
+        alert("Update failed");
+      }
+    },
+
     change_date_time: async function () {
       if (!this.selected_date || !this.selected_hours === "" || !this.selected_minutes === "") {
         alert("Please enter all required fields.");
@@ -196,7 +205,7 @@ module.exports = {
       let hours = parseInt(this.selected_hours, 10);
       const minutes = parseInt(this.selected_minutes, 10);
 
-      if (this.is_24_hr_format) {
+      if (this.config.admin.time_format) {
         if (hours < 0 || hours > 23 || minutes < 0 || minutes > 59) {
           return alert("Invalid Time");
         }
diff --git a/src/pug/templates/admin-general-view.pug b/src/pug/templates/admin-general-view.pug
index 2f56399..95a63c4 100644
--- a/src/pug/templates/admin-general-view.pug
+++ b/src/pug/templates/admin-general-view.pug
@@ -71,7 +71,7 @@ script#admin-general-view-template(type="text/x-template")
       span(v-else) {{ get_current_time }}
     
     label
-      input(type="checkbox" v-model="is_24_hr_format") 
+      input(type="checkbox" v-model="config.admin.time_format" @change="change_time_format") 
       |  Use 24-hour format
 
     .pure-form
@@ -83,8 +83,8 @@ script#admin-general-view-template(type="text/x-template")
           v-model="selected_hours" 
           placeholder="HH" 
           maxlength="2" 
-          :min="is_24_hr_format ? 0 : 1" 
-          :max="is_24_hr_format ? 23 : 12" 
+          :min="config.admin.time_format ? 0 : 1" 
+          :max="config.admin.time_format ? 23 : 12" 
           style="width:45px" 
           required
       )
@@ -101,7 +101,7 @@ script#admin-general-view-template(type="text/x-template")
         required
       )
       
-      select(:disabled="is_24_hr_format" v-model="selected_meridiem" style="width:65px")
+      select(:disabled="config.admin.time_format" v-model="selected_meridiem" style="width:65px")
         option(value="AM" selected) AM
         option(value="PM") PM
 
diff --git a/src/resources/config-template.json b/src/resources/config-template.json
index d508aa7..addb148 100644
--- a/src/resources/config-template.json
+++ b/src/resources/config-template.json
@@ -673,7 +673,7 @@
       "type": "bool",
       "default": true
     },
-    "time-format": {
+    "time_format": {
       "type": "bool",
       "default": true
     }