Skip Navigation

[Resolved] Properly populate Foobox on View

This thread is resolved. Here is a description of the problem and solution.

Problem:
How to display Foobox popup with views output

Solution:
You need to make sure that the foobox element generated have unique IDs.

You can find proposed solution, in this case, with the following reply:
https://toolset.com/forums/topic/properly-populate-foobox-on-view/#post-620806

Relevant Documentation:

This support ticket is created 6 years, 10 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Kolkata (GMT+05:30)

This topic contains 2 replies, has 2 voices.

Last updated by keithT-3 6 years, 10 months ago.

Assisted by: Minesh.

Author
Posts
#620656

Tell us what you are trying to do?
On the page/link below I want each image to open THAT image (and other custom fields) in the popup. Currently each box shows the content of the very first image when clicked. Below is the coding in my Content Template -

<div class="tenant-container" >
<div class="tenant-logo" >[wpv-for-each field="wpcf-tenant-logo-square"][types field='tenant-logo-square' alt='%%ALT%%' title='%%TITLE%%' width='200' height='200' align='center' resize='proportional'][/types]<div id="thefooboxcontent" style="display: none;"><p>[types field='tenant-logo-square' alt='%%ALT%%' title='%%TITLE%%' width='500' height='500' align='center' resize='proportional'][/types]<br />[wpv-post-title]<br />[types field='building-address'][/types] [types field='tenant-suite-number' output='raw'][/types]</p></div>[/wpv-for-each]</div>
</div>

Is there any documentation that you are following?

Is there a similar example that we can see?

What is the link to your site?
hidden link

#620806

Minesh
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Hello. Thank you for contacting the Toolset support.

Well - It looks like that the code is targeting the first ID only, I've made dynamic Id for anchors and div by adding the [wpv-post-id] shortcode as you can see with the below code:

Could you please try to use following code and try to resolve your issue:

<div class="tenant-container" >
<div class="tenant-logo" >[wpv-for-each field="wpcf-tenant-logo-square"]
<a href="#thefooboxcontent-[wpv-post-id]" target="foobox">[types field='tenant-logo-square' alt='%%ALT%%' title='%%TITLE%%' width='200' height='200' align='center' resize='proportional'][/types]</a>

<div id="thefooboxcontent-[wpv-post-id]" style="display: none;">
<p>[types field='tenant-logo-square' alt='%%ALT%%' title='%%TITLE%%' width='500' height='500' align='center' resize='proportional'][/types]<br />[wpv-post-title]<br />[types field='building-address'][/types] [types field='tenant-suite-number' output='raw'][/types]</p></div>[/wpv-for-each]</div>
</div>
#621021

That solution worked perfectly. Thank you, Minesh, for resolving my issue so quickly. You can see the updated function here now - hidden link.