[Resolved] Ajax submission on page with multiple forms not working

[Author]

Posts

[collinC-2]

Hi, I'm trying to create a page with multiple copies of the same form on it. The form creates a new custom post types that connects two custom post types together. The main difference each version of the form has is that the connection IDs are different

The form does create the custom post type as expected, however, the ajax part doesn't seem to work. When the visitor hits the submit button on the form, I'd like the confirmation message to show up and the submit button disappear. I have been able to make the confirmation message show up and used some CSS to hide the submit button. However, this only works on the first form I click the submit button on. When I click on the submit button on other forms on the page, I see the ajax spinner appear but no new confirmation message appears and the submit button is still visible.

If I turn off ajax, the page creates the custom post type on submit, but the visitor has to wait for the whole page to reload to see the other forms which is not very user friendly

I've found this thread and tried to follow the instructions on it, but it doesn't seem to have addressed the issue: https://toolset.com/forums/topic/using-ajax-to-handle-a-page-with-multiple-sub-cred-forms/.

Please let me know if you can help or I can provide more detail on this issue.

Thanks,

Collin Condray
Director of Technology
BlueZooCreative.com

[Christian Cox]

Hi, I can see our developers are investigating an issue with AJAX submission of Forms displayed in a View. I have added a link to your ticket so I can keep you posted as I receive more information about their progress, but at this time AJAX submission of Forms in a loop is broken. I apologize for the inconvenience and poor UX in the meantime, but turning off AJAX submission is the only workaround at the moment.

[collinC-2]

OK, I'll hang on until they get that fix. I've set it go to the same page after the submission. I would like to show a confirmation message on that page. What's the best way to do that in the view?

[Christian Cox]

I think the best option in that case is to choose "Keep displaying this Form". The default success message is "Post Saved" but you can modify that in the Form editor screen's Messages panel.

[collinC-2]

The page reloads but I don't see the "Post Saved" message anywhere. Once you fill out the form that connects two custom post types together, it no longer appears. I think that's why I'm not seeing that message. Is there another way to detect that the visitor is on a page after they've submitted a form?

[Christian Cox]

Are you saying the Form does not appear again, or the message does not appear after the page reloads? Try adding the cred-form-message shortcode in your Form.

The only other way to detect a Form submission is to use JavaScript to read the URL parameters. The parameter cred_referrer_form_id will be present.

[collinC-2]

Right now the page works like this:

-Load page /connect/ with 3 forms #1, #2, #3
-Each form connects the current user id with the id of another existing post type ($other-post-id)
-Submit form 1 to itself (/connnect/).
-Create a custom post type with the user ID and $other-post-id
-/connect/ page reloads with only forms #2 and #3. #1 isn't shown since the loop excludes forms with the current user ID and the $other-post-id from the previous submission. Therefore, no confirmation message for form #1 is shown.

Is there any way to detect a submission from this method or will I have to use the JavaScript method?

Thank you for your help.

[Christian Cox]

Okay I see, you can try inserting the cred-form-message shortcode outside the Loop of the View, maybe at the top of the page content where it will be visible upon reload.

[cred-form-message]

I'm not sure how that will react when you have multiple types of Forms on the same page, since it's really recommended to place inside the Form itself. JavaScript is my next suggestion.

[collinC-2]

Adding [cred-form-message] to the view fixed the issue for me. Thanks for the help!

[Christian Cox]

Just a quick note to let you know that AJAX form submission in a loop should be working in the latest version of Toolset plugins.