Search code examples
twitter-bootstrappopoverslim-lang

Cant make bootstrap popover work with slim


I am trying to implement bootstrap popover in my slim view but so far It didnt work :enter image description here

Here's the problematic part of my slim view :

 td = tournament.subscriptions.count
 td data: {container: body, html: true, content: hello, toggle: popover, placement: top, trigger: hover, title: dispo}
    = tournament.subscriptions.where(status: "confirmed").count

I think I respected the syntax but it still doesnt work. Any ideas ?


Solution

  • The problem is that you're trying to use a hash to define attributes for the td tag.

    This should work for you:

    td data-container='body' data-html='true' data-content='hello' data-toggle='popover' data-placement='top' data-trigger='hover' title='dispo'
    

    A couple of things to note for the modified td line:

    1. All of the attributes except for title are data attributes, so I added "data" to them.
    2. I was assuming that "hello" and "dispo" were supposed to be strings so I've got them quoted. If those are actually variables, just use "#{dispo}" and "#{hello}" instead.

    And in case you aren't doing this already, be sure to fire the popover method to get your popovers to actually working:

     $('[data-toggle="popover"]').popover();