Skip Navigation

[Resolved] Creating a frontend checkbox output for a list element

This support ticket is created 4 years, 3 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)

Author
Posts
#1450249

I have a recipe post type, I would prefer to display the ingredients and the instructions with frontend checkboxes so that the visitor kan mark their progress. Example from actual frontend checklist, but I'm referring to the checkbox "effect" upon click. hidden link

Thanks and regards
Lykke

#1450499

Minesh
Supporter

Languages: English (English )

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

Hello. Thank you for contacting the Toolset support.

As I understand, you want to display checkboxes list with a progress bar and a progress bar should be updated based on the checkboxes checked, just like with the reference URL you shared.

I'm afraid that there is no such native feature available with Toolset and this requires custom programming which is beyond the scope of our support policy. If you need custom programming for your project such as implementing and integrating such JS library as per your requirement, please feel free to contact our certified partners:
=> https://toolset.com/contractors/

However, I'm not aware of the library you shared as reference but I suggest you should try to follow other simply CSS+jS tricks. Please check the following code examples that may help you to implement such a feature:
=> hidden link
=> hidden link
=> hidden link
=> hidden link

I strongly suggest following the above code example and try to implement it on your own.

#1452353

No progress bar, just checkboxes for list items or repeatable form group items. Then I'll style them to cross out text when checked. Nothing else.

#1455459

Minesh
Supporter

Languages: English (English )

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

Sorry - this is still not clear to me.

Do you mean that you want to list the posts belongs to specific post types with the checkbox field?

#1466923

I am planning to use views to list ingredients and methods, I would like instead of a bullet point to have a checkbox, so that the visitor can mark their progress while cooking.

Thank you, regards
Lykke

#1468577

Minesh
Supporter

Languages: English (English )

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

so, to have a checkbox with your view, you should simply add the checkbox field to your view's Loop Editor within the loop.

<input type="checkbox" name="checkbox-field" value="[wpv-post-id]">  

Where:
- as you can see, each checkbox will have the different value as we have assigned the post ID using the shortcode [wpv-post-id].

Please check the following reference links:
=> https://stackoverflow.com/questions/386281/how-to-implement-select-all-check-box-in-html
=>hidden link
=> https://stackoverflow.com/questions/18537609/how-to-check-all-checkboxes-using-jquery/18537624#18537624

Please let me know if you need further help.

This ticket is now closed. If you're a WPML client and need related help, please open a new support ticket.