Edit post on the same page as the query loop

Is it possible to edit the post from a query loop without leaving the page, i.e. click an edit button in the query loop that fills the edit form further down the same page?

Hi Pete,

Yes, that is possible - with one restriction regarding where the form sits.

The supported way is to place the Pro Forms element inside the query loop, so every loop item renders its own form. Because it is rendered in the loop context, all dynamic data resolves to that post, and you can pre-fill the fields: every field has a “Value” control that accepts dynamic data (e.g. {post_title}, {post_excerpt}, {brf_post_meta:your_key}). Add a Hidden field with the value {post_id} and enter that field’s ID under Actions > Update Post > Post ID. The submit runs via Ajax, so the page does not reload. Keep the form collapsed (accordion, toggle, popup) so it only opens when the user clicks Edit on that item.

Please also enable “Allow only if logged in” and “Allow only for post authors” in the Update Post action, otherwise anyone could edit someone else’s post.

What does not work out of the box is a single form further down the page that gets filled by clicking an item in the loop. The fields are rendered on the server, so a form outside the loop has no way of knowing which entry you clicked - that would need custom JavaScript. If a reload is acceptable, the usual approach is to link to the same page with ?post_id=123 and use {url_parameter:post_id} as the value/context of your fields.

Kind regards
Daniele

Thanks Daniele,
This seems that the overhead might be too much. If there was hundreds of records, that would be hundreds of copies of the form.
Maybe there is a javascript option instead. I’ll have a think.

Regards
Pete

1 Like