Load Featured Image into form

Hello,

Thanks for the feedback!

You can pass custom data, or post id, to a form and then retrieve it either in PHP or in the From UI using the {form:custom_data} template tag (that can be used to target/load data from).

You’ll find an example in the Integration documention here. You’ll also find a guide showing this specific usage (retrieve ID from the URL and then pass it to an action) in this guide here.

Hope it helps!

Have a nice day!

Regards.

Edit-Form-“Add-Photo-2”-?-The-Harrisons-Website-—-WordPress.png

Thanks Konrad, I thought that is what I was doing, by passing the post_id and pointing the thumb-nail at the post image field, it would load the image, not display a button the select an image.
It seems that even if I untick certain fields in the Load tab, these fields are still shown in the form

PHO-Add-2-ACFFEA-shortcode-–-The-Harrisons-Website.png

Also, is it possible the rearrange the order of the fields on the form?

• This reply was modified 5 months ago by pzh20.

Hello,

Yes, this is how it works. Please note that you need to pass a post id where a featured thumbnail is set, and not an attachment ID.

How to do you pass the photo_id? Using acfe_form() or with the acfe/form/load_form hook? Can you post your code? You can try to acf_log($photo_id) see if it is correctly retrieved/passed.

If you’re not sure, you can try to select a specific post in the “Load > Source” setting (instead of {form:photo_id}). If the post has a featured thumbnail image, it will load the value in the Image field.

Regarding the customization of the fields order, you can use the render setting. Please check the Integration documentation I linked above, there is a section about it.

Regards.

Note: You can also use the “Render” tab in your From UI to re-arrange the order.

Thanks again for your swift response.

I use /add-photo-2?photo_Id={action:post:ID} on the first form, and the source field set to {form:photo_id} on the load form. Isn’t this correct?

Regards

Pete

Yes, it seems correct.

However, note the photo_Id with uppercase I. Please make sure that you correctly retrieve/pass the URL parameter in your PHP code with the suggestions I posted above. Also try my other suggestion (to select a specific post instead, so you’ll know if the issue come from how you retrive/pass the id).

Regards.

So if I select a specific post, it works, but using the url parameter doesn’t, in fact it’s opening the post_id of the page the form is on!, not the post_id passed via the url.

So if I go down the php route, do I need to change the first form (which is passing the correct id in the url) AND the second form, or just the second form to interigate the url and select the correct post?

Regards

Using {form:photo_id} alone is not sufficient.

You need to pass the parameter to the second form (the one which retrieve the parameter), either with acfe_form() or with the acfe/form/load_form hook (if you’re using shortcode for example), as shown on the guide here.

Please post the PHP code you’re using.

Regards.

I assume I’m misunderstanding the workflow. I didn’t realise I needed the php filter as well as the source parameter, and thanfully, it’s rendering now.

Even though I’ve unticked several fields from the field group on the load tab, they still show up on the form. As you mentioned before, do I have to handle this in the Render tab? Is this a full PHP and HTML definition of all the form elements as in the ‘hooks#form-render’ example?

Can you please explain the before and after priorities 9 and 10 comments in this example?

Many thanks

I’m glad to hear it now works as expected.

The {form:xxxxx} template tag allows you to retrieve any form setting (see documentation). That’s why you need to pass custom data if you want to retrieve it.

For example:

acfe_form(array(
    'name'     => 'my_form',   // {form:name},
    'photo_id' => 45,          // {form:photo_id}
    'post_id'  => 122,         // {form:post_id}
    'submit'   => array(
        'value' => 'Submit',   // {form:submit:value}
    ),
))

Note that you can use the template tag {request:photo_id} (see documentation), to directly retrieve the URL parameter, without any PHP code instead.

However this is considered unsafe, as the visitor might enter/change the ID in the URL, and being able to save/load any post/page on the front-end. Which is indeed problematic.

This is why I suggested the PHP method with {form:xxxxx}, as it allows you to check the current user is authorized to save/load the ID retrieved from the URL.

Furthermore, I strongly suggest you to add some safety measures in PHP to make sure the visitor is allowed to use that ID from the URL.

Regarding the checkbox in the Save/Load tabs, these settings simply tell the form which fields should have their value saved/loaded from the target/source. It does not control if it should be displayed or not. Thus the setting instruction:

Load ACF fields

Select which ACF fields should have their values loaded

If you want to only display some specific fields, or change the fields order, you can use the “Render” tab in the Form UI. There, you can enter any HTML (if needed), and any field you want to display using the {render:my_field} template tag. Example:

{render:my_field_1}
{render:my_field_2}
{render:my_field_3}

If you prefer using the PHP code/hook, then it will also work and override the “Render” set in the Form UI.

If you don’t want to enter each fields manually in the “Render” tab, you can also let the form display all fields automatically, and hide only few of them. Here is a guide explaining the different methods to hide fields on the front-end.

Regarding the question about the 9/10 before/after priority in hooks, I’m not sure to understand what you’re talking about. Can you please point which part of the documentation/hook you’re talking about?

Thanks.

Regards.

Note: Okay I see what you’re talking about for the render 9/10. It’s for the form render hooks here.

These hooks allows you to add custom HTML at any position in the form (not to change the fields order tho, see my answer above for that).

These can be interesting if you want to add custom HTML before the <form> element for example.

In this example:

<!-- acfe/form/render_before_form (priority:9) -->
<form class="acfe-form">
<!-- acfe/form/render_before_form (priority:10) -->

It means you can add custom HTML before the <form> starting tag, with:

add_action('acfe/form/render_before_form', 'my_form_before', 9);

And you can add custom HTML after the <form> starting tag, with:

add_action('acfe/form/render_before_form', 'my_form_before', 10);

Regards.

Ah, I see. I’ll give it a go.

Thanks again

Just a note, this might be a language thing, but the statement “Select which ACF fields should have their values loaded” says to me which fields are loaded onto the page.

P

• This reply was modified 5 months ago by pzh20.

English isn’t my native language, but in this sentence it’s the “value of the field” that is “loaded”, not the field itself. In the ACF lexical field, there’s also a difference between “load” & “render”, which seems coherent to me here.

It’s hard to explain in other words, but I’ll see if I can find a better description.

Regards.

Konrad, your Engish is impeccable and put me to shame. Are you based in France?