diff --git a/core/misc/states.es6.js b/core/misc/states.es6.js
index b47b90de57..57ffa8c7b1 100644
--- a/core/misc/states.es6.js
+++ b/core/misc/states.es6.js
@@ -75,6 +75,8 @@
     Object.keys(this.dependees || {}).forEach((selector) => {
       this.initializeDependee(selector, this.dependees[selector]);
     });
+    // Reevaluate to execute initial states.
+    this.reevaluate();
   };
 
   /**
@@ -146,10 +148,16 @@
           this.values[selector][state.name] = null;
 
           // Monitor state changes of the specified state for this dependee.
-          $(selector).on(`state:${state}`, { selector, state }, stateEventHandler);
+          let $dependee = $(selector);
+          $dependee.on(`state:${state}`, { selector, state }, stateEventHandler);
 
           // Make sure the event we just bound ourselves to is actually fired.
           new states.Trigger({ selector, state });
+
+          // Update initial state value, if set by data attribute.
+          if ($dependee.data(`trigger:${state.name}`) !== undefined) {
+            this.values[selector][state.name] = $dependee.data(`trigger:${state.name}`);
+          }
         }
       }
     },
@@ -368,7 +376,7 @@
 
       // Only call the trigger initializer when it wasn't yet attached to this
       // element. Otherwise we'd end up with duplicate events.
-      if (!this.element.data(`trigger:${this.state}`)) {
+      if (this.element.data(`trigger:${this.state}`) === undefined) {
         this.initialize();
       }
     }
@@ -384,6 +392,10 @@
 
       if (typeof trigger === 'function') {
         // We have a custom trigger initialization function.
+        // Create data attribute for trigger, to prevent multiple
+        // calls to this method.
+        this.element.data('trigger:' + this.state, null);
+        // Call custom trigger initialization function.
         trigger.call(window, this.element);
       }
       else {
@@ -391,9 +403,6 @@
           this.defaultTrigger(event, trigger[event]);
         });
       }
-
-      // Mark this trigger as initialized for this element.
-      this.element.data(`trigger:${this.state}`, true);
     },
 
     /**
@@ -407,6 +416,9 @@
     defaultTrigger(event, valueFn) {
       let oldValue = valueFn.call(this.element);
 
+      // Save current value to element data attribute.
+      this.element.data('trigger:' + this.state, oldValue);
+
       // Attach the event callback.
       this.element.on(event, $.proxy(function (e) {
         const value = valueFn.call(this.element, e);
@@ -414,13 +426,10 @@
         if (oldValue !== value) {
           this.element.trigger({ type: `state:${this.state}`, value, oldValue });
           oldValue = value;
+          // Save current value to element data attribute.
+          this.element.data('trigger:' + this.state, value);
         }
       }, this));
-
-      states.postponed.push($.proxy(function () {
-        // Trigger the event once for initialization purposes.
-        this.element.trigger({ type: `state:${this.state}`, value: oldValue, oldValue: null });
-      }, this));
     },
   };
 
diff --git a/core/misc/states.js b/core/misc/states.js
index 4fd2052a43..211e92058d 100644
--- a/core/misc/states.js
+++ b/core/misc/states.js
@@ -47,6 +47,8 @@
     Object.keys(this.dependees || {}).forEach(function (selector) {
       _this.initializeDependee(selector, _this.dependees[selector]);
     });
+
+    this.reevaluate();
   };
 
   states.Dependent.comparisons = {
@@ -84,9 +86,14 @@
 
           this.values[selector][state.name] = null;
 
-          $(selector).on('state:' + state, { selector: selector, state: state }, stateEventHandler);
+          var $dependee = $(selector);
+          $dependee.on('state:' + state, { selector: selector, state: state }, stateEventHandler);
 
           new states.Trigger({ selector: selector, state: state });
+
+          if ($dependee.data('trigger:' + state.name) !== undefined) {
+            this.values[selector][state.name] = $dependee.data('trigger:' + state.name);
+          }
         }
       }
     },
@@ -180,7 +187,7 @@
     if (this.state in states.Trigger.states) {
       this.element = $(this.selector);
 
-      if (!this.element.data('trigger:' + this.state)) {
+      if (this.element.data('trigger:' + this.state) === undefined) {
         this.initialize();
       }
     }
@@ -193,29 +200,29 @@
       var trigger = states.Trigger.states[this.state];
 
       if (typeof trigger === 'function') {
+        this.element.data('trigger:' + this.state, null);
+
         trigger.call(window, this.element);
       } else {
         Object.keys(trigger || {}).forEach(function (event) {
           _this2.defaultTrigger(event, trigger[event]);
         });
       }
-
-      this.element.data('trigger:' + this.state, true);
     },
     defaultTrigger: function defaultTrigger(event, valueFn) {
       var oldValue = valueFn.call(this.element);
 
+      this.element.data('trigger:' + this.state, oldValue);
+
       this.element.on(event, $.proxy(function (e) {
         var value = valueFn.call(this.element, e);
 
         if (oldValue !== value) {
           this.element.trigger({ type: 'state:' + this.state, value: value, oldValue: oldValue });
           oldValue = value;
-        }
-      }, this));
 
-      states.postponed.push($.proxy(function () {
-        this.element.trigger({ type: 'state:' + this.state, value: oldValue, oldValue: null });
+          this.element.data('trigger:' + this.state, value);
+        }
       }, this));
     }
   };