[Resolved] Possibility to create a new child post using cred form with ajax submission

[Author]

Posts

[Rita]

Hi there

I would like to ask your advice..

I have a parent custom post and a child custom post. At the moment the link to create a new child custom post is displayed on the parent custom post's content template. When the user clicks the link to create a new child post they are directed to a page where the child cred form is displayed. On 'submit' they are redirected to an appropriate site page where a view of the new child post is displayed.

Is it possible for the child post cred form to be displayed on the parent post content template with an ajax submission. So that, the user is not taken to another page to 'complete the cred form'?

I would like the user to be able to 'submit' the new child post without leaving the parent post.

Any thoughts are appreciated!

Regards

Rita

[Nigel Supporter Languages: English (English ) Spanish (Español ) Timezone: Europe/London (GMT+01:00)]

Hi Rita

You can do this by inserting the form to create the child post directly into the parent post content template (rather than as a link).

That doesn't set the parent post id (it would simply add a selector for it), but you can set the id of the parent just by using the wpv-post-id shortcode (which when displaying a single parent post will be the id of the parent).

So, modifying the default markup generated automatically for the form for the parent selector, it would look like this:

<div class="cred-group cred-group-parents">
    <div class="cred-field cred-field-_wpcf_belongs_assignment_id">
        <label class="cred-label">
            assignment Parent
        </label>
        [cred_field field='_wpcf_belongs_assignment_id' value='[wpv-post-id]']
    </div>
</div>

Here my parent post has a slug of assignment. That will render a select box to choose the parent. If you don't want your users to see this you can simply hide it with CSS, or you could use a hidden generic field to submit the parent id instead (remembering to add the parameter "persist":1 to ensure it is saved to the database.

You can then set the form to display a message (e.g. "Submitted") when the form has been submitted and have the form submit via ajax, which will then keep you on the parent page.

There is just one piece of this puzzle left, which is the initial inclusion of the child form on the parent template. Is that a problem?

If so you would need to add a button to expose the child form and a little custom Javascript to handle that.

Is that something you can do?

[Rita]

ahaaaa yes of course. Thanks Nigel! Sometimes I start thinking in a really complicated way and neglect to look at the simplicity of the action and toolset's excellent front end....

So this works nicely. The post is a child of many other posts and sitting in a template that is then sitting in each parent post template. Happily it correctly collects the id of the post it is currently being displayed on. I didn't use any jquery...? Should I have? You can see the form here as an example:
hidden link

One question though...
How do I get the action on form submit to simply refresh the parent post so the user's child post is displayed (in a view below the cred form) and a new cred form made ready. I don't want the user to go to another page, see a message or anything else....

[Rita]

Hi Nigel
Sorry I just figured it out. If I set the setting to 'Display a message instead of the form' it does just that. All resolved.
Thanks very much for your help!
Rita