Set Up Front-End Editing

With front-end editing, you can allow logged-in users to edit their submissions, allow administrators to edit all entries, or set other form-specific editing permissions based on user role. You may set up editing with a View, create a clickable list of entries with a shortcode, or pull up a user's only entry automatically for editing. Creating a View is recommended for greater flexibility.

Set up editing with a View

If you would like to set up front-end editing, we recommend that you create a View where users can see their submitted entries and edit them via an edit link. There are two main types of edit links: a standard edit link and an in-place edit link. The standard edit link will take the user to the form to edit their entry. The in-place edit link will pull up the form "in-place" for editing so the user doesn't have to leave the page.

Standard editing

If you would like users to see edit links alongside their entries, which links take the user to the published form for entry editing, follow the instructions below.

1. Go into edit your form and click the 'Settings' tab.
   
2. Scroll down to 'Permissions'. Check the Allow front-end editing of entries box. Determine which user role can edit their own submissions and which user role can edit responses submitted by other users.
   
3. Publish your form on a page. Make note of the ID of the page where the form is published.
4. Create a table View, numbered list View, basic listing View, or any other type of View. If you have already created a View that you would like to use, skip this step.
5. Add an edit link to the View's Content box:

   [editlink label="Edit" page_id=y]

   Replace 'y' with the Page ID where your form is published (from step 3).

6. Scroll down to the Advanced Settings in your View. In the 'Sort & Filter' section click the '+Add' button next to Filter Entries. Set up the filter so it says 'User ID is equal to current_user'.
   
7. Click Update to save your View.
8. Publish your View on a page if you have not done so already.

When the page is visited, a logged-in user will only see entries that they submitted. If they have permission to edit the entry, an edit link will appear by that entry.

Edit in-place

If you would like to allow users to edit an entry "in-place" without leaving the view, follow the instructions below.

1. Follow steps 1-4 here. Please note that creating a table View is not recommended for editing in-place.
2. Insert the following in your View's Content box:

   <div id="frm_container_[id]">
   Content here
   </div>
   [editlink label="Edit" prefix="frm_container_"]

   Replace 'Content here' with any content you would like.

3. Scroll down to the Advanced Settings in your View. In the 'Sort & Filter' section click the '+Add' button next to Filter Entries. Set up the filter so it says 'User ID is equal to current_user'.
   
4. Click Update to save your view.
5. Publish your View on a page if you have not done so already.

When the page is visited, a logged-in user will only see entries that they submitted. If they have permission to edit the entry, an edit link will appear by that entry. When the edit link is clicked, the user will be able to edit the entry with out leaving the view.

Edit only certain fields in place

If you'd like to limit your editing in place to only certain fields, you can add the fields="100,101,102" parameter to the editlink. Change 100,101,102 to the fields you want to include in editing in place.

<div id="frm_container_[id]">
Content here
</div>
[editlink label="Edit" prefix="frm_container_" fields="100,101,102"]

Edit and delete in-place

If you would like to be able to edit and/or delete an entry in-place on the front-end of your site, follow the directions below. Editing and deleting in place uses Ajax so the entry can be edited/deleted without a page refresh.

1. Follow steps 1-4 here. Please note that creating a table View is not recommended for editing and deleting in-place.
2. Insert the following in your View's Content box:

   <div id="frm_del_container_[id]"><div id="frm_edit_container_[id]">
   Majority of your content will go here. This is where the form will appear when you hit the Edit link.
   </div>
   [editlink label="Edit" prefix="frm_edit_container_"]
   [deletelink label="Delete" prefix="frm_del_container_"]
   Some additional content may go here.
   </div>

   The outer frm_del_container_[id] div holds all of the content that will be removed when you click the Delete link. The inner frm_edit_container_[id] div holds all of the content that will be replaced with a form when you click the Edit link.

3. Scroll down to the Advanced Settings in your View. In the 'Sort & Filter' section click the '+Add' button next to Filter Entries. Set up the filter so it says 'User ID is equal to current_user'.
   
4. Click Update to save your view.
5. Publish your View on a page.

When the page is visited, the user has the option of editing or deleting the entry in-place. The user will only see the edit/delete links if they have permission to edit the entry.

Create clickable list of entries

In order to make front-end editing easy for your users, you'll need to create a page where the user can see their submitted entries and edit them via an edit link. Follow the instructions below to create a clickable list of the current user's entries. When an entry is clicked, the user will be taken to edit the entry.

1. Go into edit your form and click the 'Settings' tab.
   
2. Scroll down to 'Permissions'. Check the Allow front-end editing of entries box. Determine which user role can edit their own submissions and which user role can edit responses submitted by other users.
   
3. Publish your form on a page. Make note of the ID of the page where the form is published.
4. Create a new page or go to the page where your form is published. Insert the following shortcode:

   [frm-entry-links id=x page_id=y]

   Replace 'x' with the form ID/Key and replace 'y' with the Page ID where the form is published.

This shortcode will display a list of entries that the current user submitted. The entry's creation date will be shown in the list by default.

When the user clicks on one of these dates, they will be able to edit that entry. For customization of the entry list, see how to display a List of Entries.

Create table with an edit link

If you would like to display all entries in a table format with an edit link, follow the steps below.

1. 1. Go into edit your form and click the 'Settings' tab.
      
   2. Scroll down to 'Permissions'. Check the Allow front-end editing of entries box. Determine which user role can edit their own submissions and which user role can edit responses submitted by other users.
      
   3. Publish your form on a page. Make note of the ID of the page where the form is published.
   4. Create a new page. Insert this shortcode on the page:

      [formresults id=x edit_link="Edit" page_id=y]

      Replace 'x' with the form ID/key and replace 'y' with the Page ID where the form is published (in step 3). You can insert the shortcode on the same page where the form is published on or create a new page.

Now when the page is visited, all entries will display in a table format with an edit link.

For more information on this shortcode, see the Display All Entries in a Table page.

Pull up single entry for editing

If you would like to limit each user to one entry and you would like to automatically pull up their entry for editing when they visit the form, follow the steps below:

1. Go into edit your form and click the 'Settings' tab.
   
2. Scroll down to 'Permissions'. Check the Limit number of form entries to one per box, and the Allow front-end editing of entries box. Determine which user role can edit their own submissions and which user role can edit responses submitted by other users.
   
3. Publish your form on a page.

Now when the user visits the form, their entry will automatically appear ready to be edited.

How to allow editing

If you would like to set up front-end editing or allow users to delete entries from the front-end, you'll need to allow front-end editing first.

1. Go into edit your form and click the 'Settings' tab.
   
2. Scroll down to 'Permissions'. Check the Allow front-end editing of entries box. Determine which user role can edit their own submissions and which user role can edit responses submitted by other users.
   

That's it! Now when you add an edit link or delete link to a View, the user will see the link if they have permission to edit.

Add edit link for specific entry

If you would like to add an edit link for a specific entry follow the directions below.

1. Go into edit your form and click the 'Settings' tab.
   
2. Scroll down to 'Permissions'. Check the Allow front-end editing of entries box. Determine which user role can edit their own submissions and which user role can edit responses submitted by other users.
   
3. Publish your form on a page. Make note of the ID of the page where the form is published.
4. Add this shortcode to a page, post, or widget:

   [frm-entry-edit-link id=x label="Edit" page_id=y]

   Replace 'x' with the entry ID, and replace 'y' with the Page ID the form is published on.

   • The entry ID can be found by going into your form and clicking on 'Entries'. The furthest left column typically contains the entry IDs. If you are inserting this link directly on a post page that was created by Formidable, you can use id="current" to dynamically get the ID of the entry from the post being viewed.
   • You can include form_id=x in this shortcode. This is the ID of the form which holds the entry to edit. Including this parameter will slightly decrease processing time.

Now when the page, post, or widget is visited, an edit link will appear if the user has permission to edit the entry. When the edit link is clicked, it will take the user to the form to edit the specified entry.

Editlink shortcode

You may insert an edit link in a View in order to allow users to easily update entries from the front-end of your site. Before an edit link will work correctly, you must set up your form to allow editing. Editing permissions can be modified on your form's Settings page.

Usage

Insert the following shortcode in a View:

[editlink label="Edit" page_id="y"]

Replace 'y' with the ID of the page where your form is published.

Please note: The edit link will only appear for those authorized to edit the entry.

Parameters

The following parameters can be used with the editlink shortcode.

Required

• page_id – The ID of the page where the form is published. You can find the ID of a page by going into edit the page and looking in the address bar as shown below.
  

Optional

• label – Change the text of the edit link which is 'Edit' by default. Use label=0 to show only the edit link URL without any added HTML.

  [editlink label="Edit" page_id=y]

• class – If you are using the label parameter, you can add an HTML class to the edit link to add styling.

  [editlink label="Edit" class="my_edit_class" page_id=y]

• prefix – If you would like to edit the entry in-place (as seen in the help desk), use the prefix parameter. In order to use the prefix parameter, you must add a div or other HTML element around your content which has an id like frm_container_[id]. When the edit link is clicked, everything inside of this container element will be replaced with the form and entry for editing. The edit link must go outside of this container element in order for the 'Cancel' link to show when editing. This may be how it would look in a View:

  [editlink label="Edit" cancel="Cancel" prefix="frm_container_"]
  <div id="frm_container_[id]">
  Content here
  </div>

  The text in red must match in order for prefix to work properly.

  • cancel – If using the prefix parameter, you can change the label on the cancel link. By default, the link will say 'Cancel'.

    [editlink label="Edit" cancel="Cancel" prefix="frm_container_"]

PHP Alternative

 

echo FrmProEntriesController::entry_edit_link(array('id' => x, 'label' => 'Edit', 'page_id' => y));

Replace 'x' with entry ID to be edited, and replace 'y' with the Page ID where the form is published.