Restore original options / tabindex on destroy(). Fixes #142, #153.

src/selectize.js

@@ -193,6 +193,13 @@ $.extend(Selectize.prototype, {
 			self.ignoreHover = false;
 		});
 
+		// store original children and tab index so that they can be
+		// restored when the destroy() method is called.
+		this.revertSettings = {
+			$children : self.$input.children().detach(),
+			tabindex  : self.$input.attr('tabindex')
+		};
+
 		self.$input.attr('tabindex', -1).hide().after(self.$wrapper);
 
 		if ($.isArray(settings.items)) {
@@ -1735,12 +1742,18 @@ $.extend(Selectize.prototype, {
 	destroy: function() {
 		var self = this;
 		var eventNS = self.eventNS;
+		var revertSettings = self.revertSettings;
 
 		self.trigger('destroy');
 		self.off();
 		self.$wrapper.remove();
 		self.$dropdown.remove();
-		self.$input.show();
+
+		self.$input
+			.html('')
+			.append(revertSettings.$children)
+			.attr({tabindex: revertSettings.tabindex})
+			.show();
 
 		$(window).off(eventNS);
 		$(document).off(eventNS);

test/api.js

@@ -535,6 +535,20 @@
 				test.selectize.destroy();
 				expect(has_namespaced_event($('body'), test.selectize.eventNS)).to.be.equal(false);
 			});
+			it('should restore original options and tabindex', function() {
+				var children = '<optgroup label="Swedish Cars">' +
+					'<option value="volvo">Volvo</option>' +
+					'<option value="saab">Saab</option>' +
+				'</optgroup>' +
+				'<optgroup label="German Cars">' +
+					'<option value="mercedes">Mercedes</option>' +
+					'<option value="audi">Audi</option>' +
+				'</optgroup>';
+				var test = setup_test('<select tabindex="9999">' + children + '</select>', {});
+				test.selectize.destroy();
+				expect(test.$select.html()).to.be.equal(children);
+				expect(test.$select.attr('tabindex')).to.be.equal('9999');
+			});
 		});
 
 	});