diff --git a/apps/home/static/home/js/tabs/styles.js b/apps/home/static/home/js/tabs/styles.js
index 2ca5d97..a657b43 100644
--- a/apps/home/static/home/js/tabs/styles.js
+++ b/apps/home/static/home/js/tabs/styles.js
@@ -106,60 +106,61 @@ async function loadMessageStyleData() {
 // region New/Edit Modal
 
 $(styleTableId).closest(".js-tableBody").siblings(".js-tableFilters").on("click", ".table-new-btn", async function() {
-    await openStyleModal(-1);
+    await openDataModal(styleModalId, -1);
 });
 
 $(styleTableId).on("click", ".edit-modal", async function() {
     let id = $(styleTableId).DataTable().row($(this).closest("tr")).data().id;
-    await openStyleModal(id);
+    await openDataModal(styleModalId, id, `/api/message-styles/${id}/`);
 });
 
-async function openStyleModal(id) {
-    $modal = $(styleModalId);
+$(styleModalId).on("submit", async function(event) {
+    event.preventDefault();
 
-    if (parseInt(id) === -1) {
-        $modal.find(".form-create").show();
-        $modal.find(".form-edit").hide();
+    if (!selectedServer) {
+        throw new Error("Cannot submit form while no server is selected");
+    }
 
-        $modal.find("[data-field]").each(function() {
-            const type = $(this).attr("type");
-            const defaultVal = $(this).attr("data-default") || "";
+    let data = { server: selectedServer.id };
 
-            if (type === "checkbox") {
-                $(this).prop("checked", defaultVal === "true");
-            }
-            else if (type === "datetime-local") {
-                $(this).val(getCurrentDateTime());
-            }
-            else {
-                $(this).val(defaultVal).change();
-            }
-        });
+    $(this).find("[data-field]").each(function() {
+        const type = $(this).attr("type");
+        const key = $(this).attr("data-field");
+        if (!key) {
+            return;
+        }
+
+        let value;
+        if (type === "checkbox") {
+            value = $(this).prop("checked");
+        }
+        else {
+            value = $(this).val();
+        }
+
+        data[key] = value;
+    });
+
+    const formData = objectToFormData(data);
+    const id = $(this).data("primary-key");
+
+    if (parseInt(id) !== -1) {
+        ajaxRequest(`/api/message-styles/${id}/`, "PATCH", formData)
+            .then(response => {
+                $(this).modal("hide");
+                $(styleTableId).trigger("doDataLoad");
+            })
+            .catch(error => logError(error))
     }
     else {
-        $modal.find(".form-create").hide();
-        $modal.find(".form-edit").show();
-
-        const data = await ajaxRequest(`/api/message-styles/${id}/`, "GET");
-
-        $modal.find("[data-field]").each(function() {
-            const key = $(this).attr("data-field");
-            const value = data[key];
-
-            if (typeof value === "boolean") {
-                $(this).prop("checked", value);
-            }
-            else if (isISODateTimeString(value)) {
-                $(this).val(value.split('+')[0].substring(0, 16));
-            }
-            else {
-                $(this).val(value).change();
-            }
-        });
+        ajaxRequest("/api/message-styles/", "POST", formData)
+            .then(response => {
+                $(this).modal("hide");
+                $(styleTableId).trigger("doDataLoad");
+            })
+            .catch(error => logError(error));
     }
-
-    $modal.modal("show");
-}
+});
 
 
 // region Load Mutator Options
diff --git a/apps/home/static/home/js/tabs/subs.js b/apps/home/static/home/js/tabs/subs.js
index 2f0486d..33e5ed9 100644
--- a/apps/home/static/home/js/tabs/subs.js
+++ b/apps/home/static/home/js/tabs/subs.js
@@ -116,55 +116,6 @@ $(subTableId).on("click", ".edit-modal", async function() {
     await openDataModal(subModalId, id, `/api/subscriptions/${id}/`);
 })
 
-async function openSubModal(id) {
-    $modal = $(subModalId);
-    $modal.find('input[data-role="is-id"]').val(id);
-
-    if (parseInt(id) === -1) {
-        $modal.find(".form-create").show();
-        $modal.find(".form-edit").hide();
-
-        $modal.find("[data-field]").each(function() {
-            const type = $(this).attr("type");
-            const defaultVal = $(this).attr("data-default") || "";
-
-            if (type === "checkbox") {
-                $(this).prop("checked", defaultVal === "true");
-            }
-            else if (type === "datetime-local") {
-                $(this).val(getCurrentDateTime());
-            }
-            else {
-                $(this).val(defaultVal).change();
-            }
-        });
-    }
-    else {
-        $modal.find(".form-create").hide();
-        $modal.find(".form-edit").show();
-
-        const data = await ajaxRequest(`/api/subscriptions/${id}/`, "GET");
-
-        $modal.find("[data-field]").each(function() {
-            const key = $(this).attr("data-field");
-            const value = data[key];
-
-            if (typeof value === "boolean") {
-                $(this).prop("checked", value);
-            }
-            else if (isISODateTimeString(value)) {
-                console.log(value.split('+')[0].substring(0, 16));
-                $(this).val(value.split('+')[0].substring(0, 16));
-            }
-            else {
-                $(this).val(value).change();
-            }
-        });
-    }
-
-    $modal.modal("show");
-}
-
 $(subModalId).on("submit", async function(event) {
     event.preventDefault();
 
@@ -193,7 +144,7 @@ $(subModalId).on("submit", async function(event) {
     });
 
     const formData = objectToFormData(data);
-    const id = $(this).find('input[data-role="is-id"]').val();
+    const id = $(this).data("primary-key");
 
     if (parseInt(id) !== -1) {
         ajaxRequest(`/api/subscriptions/${id}/`, "PATCH", formData)