My problem in a nutshell is that from within coffeescript implemented jQuery-UI handler, I cannot create and show a bootstrap modal. If I try to show the modal using the standard button approach that is on the bootstrap documentation it works just fine. EDIT 3: This is within a Ruby on Rails 3.2 application using the asset pipeline.
<a href="#my-modal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>
However, when I do this from within a jQuery-UI event handler:
$("#my-modal").modal('show')
or
$("#my-modal").modal({})
I get this error:
Uncaught TypeError: Object [object Object] has no method 'modal'
My html is very standard--I just used the example html from the bootstrap documentation. I have this coffeescript for the jQuery-UI event handler:
$ ->
$("#selectable").selectable(
selected: (event, ui) ->
$("#my-modal").modal({})
)
EDIT: As this smells of a scope issue I tried monkeying with the -> and => to see if that changed things but no changes to that made any difference.
EDIT 2: I've validated that the javascript libraries are included in the right order: jquery, jquery-ui, jquery_ujs, and then bootstrap.js. Is it possible that there's another library I need to pull in?
I've validated that $("#my-modal") finds the modal DOM object correctly by doing
console.log $("#my_modal").html()
I'm at a loss to understand this. The code looks completely straightforward and simple to me.