[Resolved] Enroll button without showing the form to the user

[Author]

Posts

[jamesH-3]

Hi Jamal

Just following on from my previous ticket.

I have created a Courses CPT, then a Courses Statuses CPT (with a one to many relationship) , with select options of Not enrolled, Enrolled and Completed.

I then created a form for the Courses Statuses.

I am using Elementor Template builder. I would like to use the Elementor Button widget. When clicked, I would like a new Courses Status post with Enrolled option already selected  to be submitted, without showing the form to the user.

How can I  achieve this?

Thanks

[Christian Cox]

Hello, unfortunately there is no integration between the Elementor Button widget and Forms, so there's not an easy way to trigger a Toolset Forms submission using a button widget provided by Elementor. That would involve custom scripting that falls outside the scope of support we offer here. Instead, I can show you how to include in a Toolset Form a hidden select field, with some option automatically preselected, and show only a single submit button, from Forms, to the front-end User. I can also show you how to apply your own custom CSS to style the button if you'd like to customize the design of the button programmatically.

To preselect a value in a Forms select field, using the drag-and-drop Form builder, you can open the settings for that select field and use the default value setting to specify which option value should be selected. In the Field Group editor, you can find the corresponding values for each option. Copy the value from the Field Group editor page into the default value option of the Form field configurations. See default-value.png for an example.

To hide the select field, drag one custom HTML content block above the select field and drag another custom HTML block below the select field. In the top HTML block, enter the HTML code as follows:

<div style="display:none;">

In the lower HTML block, enter the HTML code as follows:

</div>

That will wrap the select field in a hidden container.

To style the Submit button using your own custom CSS, you can open the Submit button configurations and add custom CSS classes as shown in custom-css-classes.png. Then add your own custom CSS styles targeting those class selectors in the Form's CSS editor.

Let me know if you have additional questions about that.

[jamesH-3]

Thanks Christian. Your advice has been very helpful.