Quantcast
Channel: DullSharpness » Uncategorized
Viewing all articles
Browse latest Browse all 18

Resolve jQueryUI and Twitter Bootstrap Button Conflict

$
0
0

I've gone through many design iterations with my side project, LoanGrid.netjQueryUI has been my widget library of choice, but I've recently begun experiments integrating Twitter Bootstrap with my designs. I was humming right along until I started using the jQuery Spinner element. Suddenly my styles weren't showing up on the spinner arrow buttons.

A little research turned up a known issue when using jQueryUI and Twitter Bootstrap together. There's a conflict between jQueryUI and Twitter Bootstrap buttons because they both define $.fn.button().  And as we can see from the jQuery Spinner API docs, our spinner depends on the button element.

A workaround is here:

var btn = $.fn.button.noConflict() // reverts $.fn.button to jqueryui btn
$.fn.btn = btn // assigns bootstrap button functionality to $.fn.btn

Thanks to user fat for posting the workaround code!

I haven't run into any other conflicts, but I'm only using a small sliver of the widget features.  However, there appear to be more conflicts between the libraries, which is the impetus for Addy Osmani's (admittedly slow-moving) jQuery UI Bootstrap project.


Viewing all articles
Browse latest Browse all 18

Trending Articles