Merge PR #755

src/selectize.js

@@ -115,6 +115,7 @@ $.extend(Selectize.prototype, {
 		var timeout_focus;
 		var classes;
 		var classes_plugins;
+		var inputId;
 
 		inputMode         = self.settings.mode;
 		classes           = $input.attr('class') || '';
@@ -126,6 +127,11 @@ $.extend(Selectize.prototype, {
 		$dropdown         = $('<div>').addClass(settings.dropdownClass).addClass(inputMode).hide().appendTo($dropdown_parent);
 		$dropdown_content = $('<div>').addClass(settings.dropdownContentClass).appendTo($dropdown);
 
+		if(inputId = $input.attr('id')) {
+			$control_input.attr('id', inputId + '-selectized');
+			$('label[for='+inputId+']').attr('for', inputId + '-selectized');
+		}
+
 		if(self.settings.copyClassesToDropdown) {
 			$dropdown.addClass(classes);
 		}

test/interaction.js

@@ -100,6 +100,43 @@
 
 		});
 
+		describe('clicking label', function() {
+
+			it('should give it focus to select', function(done) {
+				var inputId = "labeledSelect";
+				var label =
+					$('<label for="'+inputId+'">select</label>').appendTo('form');
+
+				var test = setup_test('<select id="'+inputId+'">' +
+					'<option value="a">A</option>' +
+					'<option value="b">B</option>' +
+				'</select>', {});
+
+				syn.click(label)
+					.delay(0, function() {
+						label.remove();
+						expect(test.selectize.isFocused).to.be.equal(true);
+						done();
+					});
+			});
+
+			it('should give it focus to input', function(done) {
+				var inputId = "labeledInput";
+				var label =
+					$('<label for="'+inputId+'">input</label>').appendTo('form');
+
+				var test = setup_test('<input id="'+inputId+'" type="text" value="a,b,c,d">', {});
+
+				syn.click(label)
+					.delay(0, function() {
+						label.remove();
+						expect(test.selectize.isFocused).to.be.equal(true);
+						done();
+					});
+			});
+
+		});
+
 		describe('clicking option', function() {
 
 			it('should select it', function(done) {