Skip Navigation

[Resolved] View with item-dependent class?

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

Problem:
View with item-dependent class and access the view loop index

Solution:
To get a current loop index you can use the view's shortcode: [wpv-loop-index]

You can find the proposed solution in this case with the following reply:
https://toolset.com/forums/topic/view-with-item-dependent-class/#post-2087947

Relevant Documentation:
=> https://toolset.com/documentation/programmer-reference/views/views-shortcodes/#vf-1195331

This support ticket is created 3 years, 5 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 5 replies, has 2 voices.

Last updated by joostH-2 3 years, 5 months ago.

Assisted by: Minesh.

Author
Posts
#2086815

I'm building a table seating view. I have n guests(i), i=1..n and m chairs(j), j=1...m (n=<m). Guests are defined in a CPT with a custom field chair_number. The table layout is defined with a CSS GRID. In this grid, chair fields are assigned with n classes .chair1 .... chairn, so a class per seat. In the grid other elements are defined, such as tables. So it is not a simple table. You can see a temporary example here: hidden link (the images in this example are put in manually)

What I know try to accomplish is to add class(chair_number(i) to a div that contains featured image of guest(i)). That would place the image of the guest on its assigned chair. So, something that would function like this quasi-code

for i=1:n
<div class(chair_number(i)>
[wpv-post-featured-image](i)
</div>
endif

Is it possible to create something like this with Toolset Views? If not, do you have suggestion to achieve such a view via another route?

#2087785

After a night of sleep, it occured to me that I could add something.

For me, it;s safe to assume that chairs are continuously filled starting from 1 to m. So, I could also sort on the custom field "chair" and create a loop from there. Creating the loop in Toolset is not difficult. In the end, I need two things in this approach:

1) acces to the index i or j in the loop
2) a means to concatenate the string "chair" with index i into a string "chair_i" (as the class I need)

Does Toolset provide means to do this?

#2087947

Minesh
Supporter

Languages: English (English )

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

Hello. Thank you for contacting the Toolset support.

It seems in that case you will require to use the classic view where you will have more control on HTML you specify.

To get a current loop index you can use the view's shortcode: [wpv-loop-index]
=> https://toolset.com/documentation/programmer-reference/views/views-shortcodes/#vf-1195331

More info:
=> https://toolset.com/documentation/legacy-features/views-plugin/front-page-filters/

#2088595

Hi Minesh,

Thanks for your prompt reply. The links you provide help me to a certain extent. The remaining challenge is how to concatenate the chair number, obtained with the shortcode [types field='deelnemer-stoel' format='FIELD_VALUE'][/types] with the prefix string "chair_" to obtain the string "chair_XX" (with XX the chair number from the shortcode). "chair_XX" is to be used in a piece of HTML like:
<div class="chair_XX"> ...... </div>

Being a markup language, HTML does not provide such a concatenation function, so I expect that a bit of (inline) PHP or Javascript is needed. I expect this to be trivial for an experienced programmer, but unfortunately, it is beyond my expertise. Can you help me out how to do this?

#2089173

Minesh
Supporter

Languages: English (English )

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

What if you try to use:

<div class="chair_[types field='deelnemer-stoel' format='FIELD_VALUE'][/types]"> ...... </div>

Does that helps?

#2089291

Hi Minesh,

Blimey! I just didn't try that! It never occurred to me that it could be that simple. I just assumed it wouldn't work as attribute. But it does. I was thinking way to complex.

Thanks!!

joost