{"id":25976,"date":"2022-01-18T15:11:10","date_gmt":"2022-01-18T15:11:10","guid":{"rendered":"https:\/\/crocoblock.com\/knowledge-base\/?post_type=article&p=25976"},"modified":"2023-07-28T12:47:47","modified_gmt":"2023-07-28T12:47:47","slug":"jetengine-how-to-connect-relation-items-using-forms","status":"publish","type":"article","link":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/jetengine-how-to-connect-relation-items-using-forms\/","title":{"rendered":"How to Connect Relation Items Using Forms (Legacy)"},"content":{"rendered":"\n

The JetEngine<\/strong>\u2019s relations feature<\/a> allows you to set relations right in the needed post. However, you can simplify the process by creating a form that will update relations even on the front end. So let\u2019s find out how to do it.<\/p>\n\n\n\n

Connect Child Objects to Parent Ones<\/h2>\n\n\n\n
\n

The first form we build is for attaching already existing child posts to parent ones.<\/p>\n\n\n\n

Begin by proceeding to JetEngine > Forms<\/em><\/strong>. Push the \u201cAdd New<\/strong>\u201d button to create a form.<\/p>\n\n\n\n\"jetengine\n\n\n\n

Initially, type in the title of the form.<\/p>\n\n\n\n

The Hidden Field <\/strong>and Submit Button <\/strong>are created by default. We will leave them in the form as they are vital in our case.<\/p>\n\n\n\n

Let\u2019s check the Hidden Field <\/strong>settings. These should be left without changes as this field will be the source for the ID of a parent element.<\/p>\n\n\n\n

Push the \u201cApply Changes<\/strong>\u201d button to save the field.<\/p>\n\n\n\n\n\n\n\n

To place one more field into the form, click on the \u201cAdd Field<\/strong>\u201d button. <\/p>\n\n\n\n

The new field will be placed right after the Submit Button <\/strong>as we didn\u2019t delete it. However, you can easily change the order of the fields by dragging the needed field and dropping it in the desired place.<\/p>\n\n\n\n\"changing\n\n\n\n

The field we have added should display the list of related posts. So, you can use any field type that lets you make a list of the options.<\/p>\n\n\n\n

We will use the \u201cCheckboxes Field\u201d as a Type <\/strong>to pick several options that will be added as related once the form is submitted.<\/p>\n\n\n\n

Complete the Name<\/strong> of the field and add its Label <\/strong>and Description <\/strong>if desired.<\/p>\n\n\n

<\/svg><\/div>
Warning<\/div>

The Name<\/strong> field should contain a value with only lowercase Latin letters, no spaces. If you want to split words, this can be done by using the \u201c-\u201d and \u201c_\u201d characters. In such a way, the information will be saved correctly in the database.<\/p><\/div><\/div>\n\n\n\n

Remember to define whether the fields you create are obligatory by ticking the Required <\/strong>field.<\/p>\n\n\n\n\"checkboxes\n\n\n\n

Select the \u201cPosts\u201d as the source in the Fill Options From <\/strong>field and define the needed Post Type<\/strong>.<\/p>\n\n\n\n

Since we will attach child posts to the parent objects, it\u2019s necessary to pick the Child object post type.<\/p>\n\n\n\n

We skip the Value from meta field<\/strong> and the Calculated value from meta field<\/strong> as they are not needed for the form we create.<\/p>\n\n\n\n

Check the following Custom item template <\/strong>field if you want to attach the custom template to the field and move to the Default <\/strong>field.<\/p>\n\n\n\n

Press the \u201cDynamic tags<\/strong>\u201d button to open the pop-up with the additional settings.<\/p>\n\n\n\n\"checkboxes\n\n\n\n

There are several settings to adjust in the displayed pop-up:<\/p>\n\n\n\n\"checkboxes\n\n\n\n