Form plugin ajax submit not working

[alexrod00]

Hi, thank you for the theme.

I would like to develop this theme into an interactive forum (like bbpress). I have some experience in working with Wordpress but I'm still new to Vue. I usually use a form plugin called Formidable Forms for user interactions within my site.

1. I created a "Submit a forum topic" form for users to submit new topic. I tried integrating the form plugin, using shortcodes in pages, within this theme. It does submit the topic correctly, however, it reloads the page. The form has a "submit with ajax" option but it isn't working here.

2. Can you please guide me in how to make the comment system work (validation, submission, pagination & replying on comments) in this so that users can comment on the topics?

3. How do I get the logged in user info? Do I need to create a callback in the RADL or is it already integrated in the theme.

[michaelscheurer]

I created a "Submit a forum topic" form for users to submit new topic. I tried integrating the form plugin, using shortcodes in pages, within this theme. It does submit the topic correctly, however, it reloads the page. The form has a "submit with ajax" option but it isn't working here.

Just some thoughts:

• Did you make "npm install" and "npm run build"?
• I can easy integrate forms with the caldera form plugin on my site.

[alexrod00]

@bucky355 I tried calling my form through it's rest api. I get the below html structure and on submission it redirects to /wp-admin/admin-ajax.php?action=frm_forms_preview&form=hf0tn and then to the 404 page. In the network tab I see page/?slug=admin-ajax.php

<form enctype="multipart/form-data" method="post" class="frm-show-form  frm_js_validate  frm_pro_form  frm_ajax_submit " id="form_hf0tn" action="http://my-site/wp-admin/admin-ajax.php?action=frm_forms_preview&form=hf0tn">
//other tags
</form>

Is there a way to make this work? There are many plugins that use admin-ajax for ajax purposes and maybe there's a way to make this compatible with vue?

[bshiluk]

There's definitely a way to make it work, it's just a matter of complexity.

You see that in your network tab because of how the regex (path matching) for the routing is set up by default.

When you change the URL the router tries to match your http://my-site/wp-admin/admin-ajax.php?action=frm_forms_preview&form=hf0tn action to a route, which falls back to the page route. If a page is not found, it will redirect to the 404 route.

To make it work, you would prevent the default browser behavior for your form submission (which reloads the page). Use JS to call your form and handle the response within your component.

As far as user info goes, that's already integrated. You would need to add a users enpoint when you initialize the RADL plugin, and then you could make the requests within your component using the provided actions and getters.

I can look at this in more depth on the weekend.