[Resolved] I need a form which allows me to add a product and connect a custom post type

[Author]

Posts

[Nicholas]

Tell us what you are trying to do?
I need a form which allows me to add a product and at the same time connect a custom post to that product.

Is there any documentation that you are following?
https://toolset.com/documentation/post-relationships/
https://toolset.com/documentation/post-relationships/how-to-set-up-post-relationships-using-toolset/
https://toolset.com/documentation/post-relationships/how-to-display-related-posts-with-toolset/
https://toolset.com/documentation/post-relationships/how-to-build-front-end-forms-for-connecting-posts/
https://toolset.com/documentation/post-relationships/how-to-build-front-end-forms-for-connecting-posts/creating-new-connections-between-related-posts/
https://toolset.com/documentation/post-relationships/how-to-build-front-end-forms-for-connecting-posts/editing-existing-connections-between-related-posts/

I was reading through the docs but I can't seem to find the right documentation about how I can have a form that allows me to create a product and then connect a custom post to that product at the same time using only one form.

Please help.

Regards,
Nick

[Christian Cox]

Hi, if it's a one-to-many relationship between your CPT and Products, where the CPT is the parent and the Product is the child, then a Form to create Products will automatically include the parent CPT selection field if you use the "auto-generate" button in the Form editor. If the post relationship is anything else, it's going to require custom code. There is no way in the current system to both create and relate M2M posts in a single Form.

We have the toolset_connect_posts API to help you make post relationship associations programmatically, and the cred_save_data API to trigger that relationship code after a new post is created. The general idea is:
- Create a generic field in the new post Form to capture the related post ID
- Use Views if necessary to automate the generic field options (option values should be relatable post IDs)
- Use the cred_save_data hook to capture the generic field selection (you can access the generic field in the $_POST superglobal)
- Use toolset_connect_posts to automatically associate the two posts

Similar ticket with some related code:
https://toolset.com/forums/topic/connect-company-to-company-offer-via-front-end/#post-1122966

Documentation for these APIs:
https://toolset.com/documentation/programmer-reference/cred-api/#cred_save_data
https://toolset.com/documentation/customizing-sites-using-php/post-relationships-api/#toolset_connect_posts

[Nicholas]

Thanks Christian,
I'll check it out.

[Shane]

Hi Nicholas,

Christian is on Holiday today and will be back tomorrow to answer any concerns you may have.

Thanks,
Shane

[Christian Cox]

Okay, let me know if you have further questions. I'll stand by.

[Nicholas]

Thanks, Christian.

you said:
"...if it's a one-to-many relationship between your CPT and Products, where the CPT is the parent and the Product is the child, then a Form to create Products will automatically include the parent CPT selection field if you use the "auto-generate" button in the Form editor."

I looked into this and this is exactly what I needed. I am using the parent CPT selection field now.
[cred_field field='@organization-campaign.parent' class='form-control' output='bootstrap' select_text='--- not set ---']

At the moment it looks like this on the frontend (see the first screenshot). It's cool that I can search for custom posts via select2, however, I need to make it look like what you see in the next two screenshots. (desktop, mobile).

Do you mind guiding me in a direction where I can achieve this programmatically maybe?

Can I include a toolset view into the form like so so I can search and filter for a custom post, which I then assign?

[credform class='cred-form cred-keep-original']
[wpv-view name="select-custom-post" view_display="layout" limit="1" orderby="field-wpcf-custom-field"]
[wpv-form-view name="select-custom-post" target_id="self"]
...
...
...
    [cred_field field='form_messages' value='' class='alert alert-warning']
    [cred_field field='form_submit' value='Publish' urlparam='' class='sfc-button']
[/credform]

Thanks,
Nick

[Nicholas]

I stumbled upon this thread.

https://toolset.com/forums/topic/views-inside-a-cred-generic-field/

Could a solution like this work maybe?

[Christian Cox]

Using a View to define the options for a generic field is possible, but it won't help you produce a search UI like the two screenshots, with a search box filter and checkbox to select the parent post. It will help you produce a UI like a standard "select" field. If you want a more robust search system for finding the parent post, you will probably have better luck accomplishing this in Toolset by building the parent search separate from the Form. Let your Users search for the parent post first, then in the search results include a link to create a child post for that parent post. That link will point to a URL with the new child post Form, and it will have a URL parameter defined to select the desired parent post, something like "?parent=12345". Use CSS to hide the parent select field, since it's already predetermined.

Embedding a search View like this inside a Form isn't recommended.

[Nicholas]

Thanks,
could it also work that you have the form first, then the search view where you select the post of the custom post type and then the preview of the newly created product?

If you don't like what you created can you then edit the product and also change the selected post which you associated with the product?

[Christian Cox]

Let's take that step by step because I'm not really clear what you're asking.

could it also work that you have the form first...
You have a new post Form. It does not include the parent select field. Good so far.

...then the search view where you select the post of the custom post type...
Do you mean after the Form on the same page? Or after you submit the Form you go to a separate page?
If it's on the same page, what happens to the Form after you submit it? Does it become an edit post Form, or is it deactivated, or what?

and then the preview of the newly created product?
Do you mean on the same page as the Form and search View, or on a separate page after choosing the parent post?

[Nicholas]

Step 1) Yes. The form will create a product.

Step 2)

Scenario 1: Could the search view be on the same page after the form potentially?
Scenario 2: The search view is on a second page where I choose a post that I want to connect to the product I created in step 1

Step 3) I connect a post and get redirected to the freshly created product page.

Step 4) I can edit the product and the post connection

Hope that helps.

[Christian Cox]

Scenario 1: Could the search view be on the same page after the form potentially?
Sure, you can add other contents to a page containing a Form. Integrating with that existing Form is another thing altogether, because there is no JavaScript API for Forms. Submitting the Form doesn't capture anything from the parent search, and selecting something in the parent search doesn't update the Form. That will require custom code that we don't offer here in the forums.

Scenario 2: The search view is on a second page where I choose a post that I want to connect to the product I created in step 1
In this case you need a way to maintain the ID of that post that was just created. Usually that's done by passing the new post ID into a URL parameter during the Form redirect. We have an API that will help you programmatically redirect to a different URL: https://toolset.com/documentation/programmer-reference/cred-api/#cred_success_redirect
The question is how do you link the parent and the child posts. Normally you would use a Relationship Form, but you want a custom parent search interface. If you're trying to use custom code, you'll need to use the toolset_connect_posts API to link the parent and child.

Step 3) I connect a post and get redirected to the freshly created product page.
Depends on how you plan to handle connecting the posts, since you're using a custom parent search interface. Generally speaking you can access the child post ID from the URL parameter and use that to craft a redirect to the child post URL.

Step 4) I can edit the product and the post connection
So you have an edit Form on the Product page, but it doesn't include the post connection information. That's part of some custom interface you have developed.

[Nicholas]

My issue is resolved now. Thank you, Christian!