From c49dbe0f0120dec9922d5cb6459a93d33ef41579 Mon Sep 17 00:00:00 2001
From: Glenn Goodrich <glenn.goodrich@gmail.com>
Date: Thu, 26 May 2011 11:28:17 -0400
Subject: [PATCH] Button: modified the event bindings for focus and blur. Fixed
 #6711 - checkbox/radio button do not show focused state when using Keyboard
 Navigation

---
 tests/unit/button/button_tickets.js |  8 ++++++++
 ui/jquery.ui.button.js              | 16 +++++++++-------
 2 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/tests/unit/button/button_tickets.js b/tests/unit/button/button_tickets.js
index 79bbfeb5c..9a7ccae43 100644
--- a/tests/unit/button/button_tickets.js
+++ b/tests/unit/button/button_tickets.js
@@ -20,6 +20,14 @@ test( "#6262 - buttonset not applying ui-corner to invisible elements", function
 	ok( set.find( "label:eq(2)" ).is( ".ui-button.ui-corner-right" ) );
 });
 
+test( "#6711 Checkbox/Radiobutton do not Show Focused State when using Keyboard Navigation", function() {
+	var check = $( "#check" ).button(),
+		label = $( "label[for='check']" );
+	ok( !label.is( ".ui-state-focus" ) );
+	check.focus();
+	ok( label.is( ".ui-state-focus" ) );
+});
+
 test( "#7092 - button creation that requires a matching label does not find label in all cases", function() {
 	var group = $( "<span><label for='t7092a'/><input type='checkbox' id='t7092a'/></span>" );
 	group.find( "input:checkbox" ).button();
diff --git a/ui/jquery.ui.button.js b/ui/jquery.ui.button.js
index a95dddc6c..3f3b90e92 100644
--- a/ui/jquery.ui.button.js
+++ b/ui/jquery.ui.button.js
@@ -95,19 +95,21 @@ $.widget( "ui.button", {
 				}
 				$( this ).removeClass( hoverClass );
 			})
-			.bind( "focus.button", function() {
-				// no need to check disabled, focus won't be triggered anyway
-				$( this ).addClass( focusClass );
-			})
-			.bind( "blur.button", function() {
-				$( this ).removeClass( focusClass );
-			})
 			.bind( "click.button", function( event ) {
 				if ( options.disabled ) {
 					event.stopImmediatePropagation();
 				}
 			});
 
+		this.element
+			.bind( "focus.button", function() {
+				// no need to check disabled, focus won't be triggered anyway
+				self.buttonElement.addClass( focusClass );
+			})
+			.bind( "blur.button", function() {
+				self.buttonElement.removeClass( focusClass );
+			});
+
 		if ( toggleButton ) {
 			this.element.bind( "change.button", function() {
 				if ( clickDragged ) {
-- 
2.39.5