Button inside a floatbox

Page: 1

Author Post
Member
Registered: Oct 2012
Posts: 19
I want to add a button inside a floatbox to replace the floatbox content.

When I use the classic hyperlink, it works as expected :

<a class="floatbox mini_ajax nofloatbox" href="myphp.php" id="fb"><span class="pointer">Select</span></a>

For better visual effect I want to replace the hyperlink with a button.

So, I try something like this :

<button type="button" class="noclick" onclick="fb.ajax({ source:'myphp.php', updateNode:'myDiv' })">BUTT</button>
<div id='myDiv'></div>

But nothing happens when I click the button (but this code works on a html page).

How can I do this ?

Thanks for help.
Administrator
Registered: Aug 2008
Posts: 3382
I think you're looking for fb.start() as the onclick action. Use the sameBox:true option to open the new content in the existing floatbox. See the API reference for syntax details.
Member
Registered: Oct 2012
Posts: 19
Thanks for you reply.

I look at the doc and the demos, but still have the same problem with fb.start() action.

When I use the classic hyperlink, it works as expected :

<a href="myphp.php" onclick="fb.start(this); return false;">do it</a>

But nothing happens when I click the button :

<button type="button" href="myphp.php" onclick="fb.start(this); return false;">do it</button>

Best regards
Administrator
Registered: Aug 2008
Posts: 3382
You'll have to show me the troublesome page online somewhere if I am to debug it.
Administrator
Registered: Aug 2008
Posts: 3382
Maybe you have iframe content in your floatbox and the floatbox.js file is not loaded in that page. If that's the case, you'd call fb from the parent page with parent.fb.start().
Member
Registered: Oct 2012
Posts: 19
Still same problem.

I reproduce the problem in my test server, so you can have a look. How can I send you the site infos ?
Administrator
Registered: Aug 2008
Posts: 3382
If you don't want to post the link publicly here on this forum, you can send it through the forum's email message system or through this site's contact form (under the Support menu).
Administrator
Registered: Aug 2008
Posts: 3382
"fb.start(this)" is assigned as the onclick action for the button. The "this" keyword refers to the button, but a button is not a startable type. That button also has an "href" attribute which I imagine is what you wish to start, but buttons don't have meaningful href attributes so that does nothing. A button element is not an <a> element, and cannot be used interchangeably with one.

Put want you want to start as the first parameter to the fb.start() function. I believe this will be fb.start('ajaxfb.php?option=map&type=bas', 'type:ajax sameBox:true').

I've put "type:ajax" in the options because the file name suggests it's an ajax fetch that is desired, and "sameBox:true" is in the options because you suggested you want to replace the current contents of the already opened floatbox.

Cheers...
Member
Registered: Oct 2012
Posts: 19
The button doesn't work with fb.start(...) but with parent.fb.start(...).

But in this case I have other problems :
- title box has disappeared
- the inside box is white (instead of light blue)
- my map doesn't show

Regards.
Administrator
Registered: Aug 2008
Posts: 3382
To place a caption on the floatbox, set the caption option. (I think this is what you mean by "title box".)

Looking at your content source I see that, despite its name, it's not ajax content. It's a full document page and should be loaded as an iframe. Remove "type:ajax" from your options.
Member
Registered: Oct 2012
Posts: 19
Thanks very much. Now it works perfect.

Page: 1