diff --git a/app/assets/javascripts/discourse/app/controllers/preferences/profile.js b/app/assets/javascripts/discourse/app/controllers/preferences/profile.js
index fb31cf33926..444de26c9f0 100644
--- a/app/assets/javascripts/discourse/app/controllers/preferences/profile.js
+++ b/app/assets/javascripts/discourse/app/controllers/preferences/profile.js
@@ -86,21 +86,29 @@ export default Controller.extend({
       this.model.set("user_option.timezone", moment.tz.guess());
     },
 
-    save() {
-      this.set("saved", false);
-
+    _updateUserFields() {
       const model = this.model,
         userFields = this.userFields;
 
-      // Update the user fields
       if (!isEmpty(userFields)) {
         const modelFields = model.get("user_fields");
         if (!isEmpty(modelFields)) {
           userFields.forEach(function (uf) {
-            modelFields[uf.get("field.id").toString()] = uf.get("value");
+            const value = uf.get("value");
+            modelFields[uf.get("field.id").toString()] = isEmpty(value)
+              ? null
+              : value;
           });
         }
       }
+    },
+
+    save() {
+      this.set("saved", false);
+      const model = this.model;
+
+      // Update the user fields
+      this.send("_updateUserFields");
 
       return model
         .save(this.saveAttrNames)
diff --git a/app/assets/javascripts/discourse/tests/unit/controllers/preferences-profile-test.js b/app/assets/javascripts/discourse/tests/unit/controllers/preferences-profile-test.js
new file mode 100644
index 00000000000..bd0f9624321
--- /dev/null
+++ b/app/assets/javascripts/discourse/tests/unit/controllers/preferences-profile-test.js
@@ -0,0 +1,41 @@
+import { discourseModule } from "discourse/tests/helpers/qunit-helpers";
+import { test } from "qunit";
+import EmberObject from "@ember/object";
+import User from "discourse/models/user";
+
+discourseModule("Unit | Controller | preferences/profile", function () {
+  test("prepare custom field data", function (assert) {
+    const controller = this.getController("preferences/profile", {
+      model: User.create({
+        id: 70,
+        second_factor_enabled: true,
+        is_anonymous: true,
+        user_fields: {
+          field_1: "1",
+          field_2: "2",
+          field_3: "3",
+        },
+      }),
+      currentUser: {
+        id: 1234,
+      },
+    });
+    controller.set("userFields", [
+      EmberObject.create({ value: "2", field: { id: "field_1" } }),
+      EmberObject.create({ value: null, field: { id: "field_2" } }),
+      EmberObject.create({ value: [], field: { id: "field_3" } }),
+    ]);
+    controller.send("_updateUserFields");
+    assert.equal(
+      controller.model.user_fields.field_1,
+      "2",
+      "updates string value"
+    );
+    assert.equal(controller.model.user_fields.field_2, null, "updates null");
+    assert.equal(
+      controller.model.user_fields.field_3,
+      null,
+      "updates empty array as null"
+    );
+  });
+});