How to use bootstrap popover ?

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
4 messages Options
Reply | Threaded
Open this post in threaded view
|

How to use bootstrap popover ?

Thomas Heniart
Hi guys,

I tried to use the bootstrap popover but unfortunately I can't make it work and I don't know why

I work on a really simple example, just a component register with JQDevelopmentLibrary and TBSDevelopmentLibrary.

The content of renderContentOn: is
        html script: 'initialize_popover()'.
html tbsButton
beDefault;
attributeAt: 'data-toggle' put: 'popover';
attributeAt: 'title' put: 'Popover test';
attributeAt: 'data-placement' put: 'right';
attributeAt: 'data-content' put: 'This is a test';
with: 'Button popover test'

And the js method initialize_popover() is define in script method of my component with $("[data-toggle = 'popover']").popover()

And that's all

Then I load this little app, no error in the debugger but when I click on my button, the popover doesn't appear

Maybe I'm missing something but I don't know what :/

_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Reply | Threaded
Open this post in threaded view
|

Re: How to use bootstrap popover ?

Mariano Martinez Peck
That looks correct to me. Did you checked in the console of Chrome's developer tool to see if there was a JS error ?

On Sat, Mar 26, 2016 at 8:59 AM, Thomas Heniart <[hidden email]> wrote:
Hi guys,

I tried to use the bootstrap popover but unfortunately I can't make it work and I don't know why

I work on a really simple example, just a component register with JQDevelopmentLibrary and TBSDevelopmentLibrary.

The content of renderContentOn: is
        html script: 'initialize_popover()'.
html tbsButton
beDefault;
attributeAt: 'data-toggle' put: 'popover';
attributeAt: 'title' put: 'Popover test';
attributeAt: 'data-placement' put: 'right';
attributeAt: 'data-content' put: 'This is a test';
with: 'Button popover test'

And the js method initialize_popover() is define in script method of my component with $("[data-toggle = 'popover']").popover()

And that's all

Then I load this little app, no error in the debugger but when I click on my button, the popover doesn't appear

Maybe I'm missing something but I don't know what :/

_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside




--

_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Reply | Threaded
Open this post in threaded view
|

Re: How to use bootstrap popover ?

Thomas Heniart
Yes,

I found the problem, I must do

html script: (html jQuery ready: (html jQuery: 'dom element needed') call: 'popover')

to add a loading script as expected

2016-03-27 15:15 GMT+02:00 Mariano Martinez Peck <[hidden email]>:
That looks correct to me. Did you checked in the console of Chrome's developer tool to see if there was a JS error ?

On Sat, Mar 26, 2016 at 8:59 AM, Thomas Heniart <[hidden email]> wrote:
Hi guys,

I tried to use the bootstrap popover but unfortunately I can't make it work and I don't know why

I work on a really simple example, just a component register with JQDevelopmentLibrary and TBSDevelopmentLibrary.

The content of renderContentOn: is
        html script: 'initialize_popover()'.
html tbsButton
beDefault;
attributeAt: 'data-toggle' put: 'popover';
attributeAt: 'title' put: 'Popover test';
attributeAt: 'data-placement' put: 'right';
attributeAt: 'data-content' put: 'This is a test';
with: 'Button popover test'

And the js method initialize_popover() is define in script method of my component with $("[data-toggle = 'popover']").popover()

And that's all

Then I load this little app, no error in the debugger but when I click on my button, the popover doesn't appear

Maybe I'm missing something but I don't know what :/

_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside




--

_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside



_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Reply | Threaded
Open this post in threaded view
|

Re: How to use bootstrap popover ?

Johan Brichau-2
There is:

html document addLoadScript:  (html jQuery: 'dom element needed') call: 'popover’)

for that

cheers
Johan

On 27 Mar 2016, at 16:33, Thomas Heniart <[hidden email]> wrote:

Yes,

I found the problem, I must do

html script: (html jQuery ready: (html jQuery: 'dom element needed') call: 'popover')

to add a loading script as expected

2016-03-27 15:15 GMT+02:00 Mariano Martinez Peck <[hidden email]>:
That looks correct to me. Did you checked in the console of Chrome's developer tool to see if there was a JS error ?

On Sat, Mar 26, 2016 at 8:59 AM, Thomas Heniart <[hidden email]> wrote:
Hi guys,

I tried to use the bootstrap popover but unfortunately I can't make it work and I don't know why

I work on a really simple example, just a component register with JQDevelopmentLibrary and TBSDevelopmentLibrary.

The content of renderContentOn: is
        html script: 'initialize_popover()'.
html tbsButton
beDefault;
attributeAt: 'data-toggle' put: 'popover';
attributeAt: 'title' put: 'Popover test';
attributeAt: 'data-placement' put: 'right';
attributeAt: 'data-content' put: 'This is a test';
with: 'Button popover test'

And the js method initialize_popover() is define in script method of my component with $("[data-toggle = 'popover']").popover()

And that's all

Then I load this little app, no error in the debugger but when I click on my button, the popover doesn't appear

Maybe I'm missing something but I don't know what :/

_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside




--

_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside


_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside


_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside