Button: Don't fire click/change events if mouse was dragged during click of toggle (checkbox/radio) button. Fixed #6970 - Button state inconsistencies after (accidental) drag-clicking the button.

This commit is contained in:
Kris Borchers 2011-05-13 15:28:10 -04:00 committed by Scott González
parent aec3f18932
commit a69a1788bc

View File

@ -13,7 +13,7 @@
*/
(function( $, undefined ) {
var lastActive,
var lastActive, startXPos, startYPos, clickDragged,
baseClasses = "ui-button ui-widget ui-state-default ui-corner-all",
stateClasses = "ui-state-hover ui-state-active ",
typeClasses = "ui-button-icons-only ui-button-icon-only ui-button-text-icons ui-button-text-icon-primary ui-button-text-icon-secondary ui-button-text-only",
@ -112,13 +112,36 @@ $.widget( "ui.button", {
if ( toggleButton ) {
this.element.bind( "change.button", function() {
if ( clickDragged ) {
return;
}
self.refresh();
});
// if mouse moves between mousedown and mouseup (drag) set clickDragged flag
// prevents issue where button state changes but checkbox/radio checked state
// does not in Firefox (see ticket #6970)
this.buttonElement
.bind( "mousedown.button", function( event ) {
if ( options.disabled ) {
return;
}
clickDragged = false;
startXPos = event.pageX;
startYPos = event.pageY;
})
.bind( "mouseup.button", function( event ) {
if ( options.disabled ) {
return;
}
if ( startXPos !== event.pageX || startYPos !== event.pageY ) {
clickDragged = true;
}
});
}
if ( this.type === "checkbox" ) {
this.buttonElement.bind( "click.button", function() {
if ( options.disabled ) {
if ( options.disabled || clickDragged ) {
return false;
}
$( this ).toggleClass( "ui-state-active" );
@ -126,7 +149,7 @@ $.widget( "ui.button", {
});
} else if ( this.type === "radio" ) {
this.buttonElement.bind( "click.button", function() {
if ( options.disabled ) {
if ( options.disabled || clickDragged ) {
return false;
}
$( this ).addClass( "ui-state-active" );