* Added boolean value to onChange event handler to indicate whether the requirements have been met or not.

* Some code cleanup.
* Updated demo.

Author: dnasir

demo.html

@@ -107,8 +107,11 @@ <h6>Code</h6>
 			requires: ['.step1', '.step2'],
 			onChange: function(event, value, requiredValues) {
 				// do stuff
+
+				// event is the change event object for the current dropdown
 				// value is the current dropdown value
 				// requiredValues is an object with required dropdown values
+				// requirementsMet is a boolean value to indicate if all requirements (including current dropdown having a value) have been met
 			}
 		}
 	]
@@ -191,7 +194,7 @@ <h6>Code</h6>
 					}));
 				});
 			},
-			onChange: function(event, value, requiredValues){
+			onChange: function(event, value, requiredValues, requirementsMet){
 				// do stuff
 			}
 		}
@@ -307,7 +310,9 @@ <h6>Code</h6>
 					{
 						selector: '.step3',
 						requires: ['.step1', '.step2'],
-						onChange: function(event, value, requiredValues) {
+						onChange: function(event, value, requiredValues, requirementsMet) {
+							if(!requirementsMet) return;
+
 							example1.loading(true);
 
 							var ajaxData = requiredValues;
@@ -359,7 +364,9 @@ <h6>Code</h6>
 								}));
 							});
 						},
-						onChange: function(event, value, requiredValues) {
+						onChange: function(event, value, requiredValues, requirementsMet) {
+							if(!requirementsMet) return;
+
 							example2.loading(true);
 
 							var ajaxData = requiredValues;

jquery.cascadingdropdown.js

@@ -1,5 +1,5 @@
 /* 
- *   jQuery Cascading Dropdown Plugin 1.2.3
+ *   jQuery Cascading Dropdown Plugin 1.2.4
  *   https://github.com/dnasir/jquery-cascading-dropdown
  *
  *   Copyright 2013, Dzulqarnain Nasir
@@ -40,7 +40,8 @@
             // Init event handlers
             if(typeof self.options.onChange === 'function') {
                 self.el.change(function(event) {
-                    self.options.onChange.call(self, event, self.el.val(), self.getRequiredValues());
+                    var requirementsMet = self._requirementsMet() && self.el[0].value;
+                    self.options.onChange.call(self, event, self.el.val(), self.getRequiredValues(), requirementsMet);
                 });
             }
 
@@ -166,12 +167,7 @@
             }
 
             // Reset the dropdown value so we don't trigger a false call
-            var firstItem = self.el.children('option')[0];
-            if(firstItem && firstItem.value === '') {
-                self.setSelected(0);
-            } else {
-                self.el.val('').change();
-            }
+            self.el.val('').change();
 
             // Fetch data from required dropdowns
             var data = self.getRequiredValues();
@@ -235,7 +231,7 @@
         _triggerReady: function() {
             if(!this.initialised) {
                 this.initialised = true;
-                this.el.trigger('ready');
+                this.el.triggerHandler('ready');
             }
         },