Modal pop up form

Hello,
I haven't personally tried this so not sure it will work. Here are some ideas

1. Since you already have the view in a model popup, you could try "Editing in place". In this way, you can edit without leaving the popup view.

https://formidableforms.com/knowledgebase/set-up-front-end-editing/#kb-edit-in-place

2. You could publish your form in a model popup - same way as how you published your view. There is an add-on for the model popup that you might be interested in

https://formidableforms.com/knowledgebase/bootstrap-modal/#kb-display-a-form-in-a-modal-popup

Hi

Thanks for your reply. Agree editing in place is one option. I like the idea of a form popping up for editing as it keeps it simple for the user. They see the same form to enter a new event and editing it.

I had my form in modal popup and my view in modal popup. Then the edit button pointed to the page where the modal popup form was. But this only takes the person to that page when they click the edit button. They still have to click another button to open the modal popup form. So its a 2 step process. What I mean is that the pop up form doesn't open by itself. I need to somehow embed the popup form link in the edit button not the page number of where the popup form is located.

Thanks

I see what you mean. Unfortunately, I'm not sure how to fix it. Hope others in this forum has a solution for you. You can also contact official Formidable forms support.

I'm using shortcodes ultimate to accomplish this task. This is going to vary depending on how you are displaying your entries. For my case, I'm using div tags that create my rows that simulate a table.

The outer most div of the row has these attributes defined and this is placed into my view "content" box:

<div class="su-row su-lightbox" data-mfp-src="#item-[id]" data-mfp-type="inline">
Something here for the row
</div>

This creates a dynamic row id based on the entry (e.g., #item-211, #item-212, etc.). This will help us dynamically determine the entry to edit in our form.

I've placed this into the same "content" box after all of my main information (So that my popup content is dynamic as well):

[su_lightbox type="inline" src="#item-[id]"][/su_lightbox]
[su_lightbox_content id="item-[id]" width="80%" text_align="left"]
My pop content here and a link defined very similarly as the row div
<a class="button su-lightbox" data-mfp-src="#edit-item-[id]" data-mfp-type="inline">Edit</a>
[/su_lightbox_content]

This piece creates the popup with whatever dynamic content I wish to show in it and will be hidden until the outer row div is clicked on. The button that will show inside the popup content is linked to the same modal popup and will switch out the content for the popup content listed below, which is an edit entry form loading the dynamic ID and allowing you to edit it in-line.

[su_lightbox type="inline" src="#edit-item-[id]"][/su_lightbox]
[su_lightbox_content id="edit-item-[id]" width="80%" text_align="left"]
<h3>Edit Action Item #[id]</h3>
[formidable id="ID here" entry_id="[id]"]
[/su_lightbox_content]

Bonus:
In the "General" settings of the form of "On Submit" and "On Update" content boxes, I've placed in the following jquery:

<script>
jQuery('.entry-content').html('<center>Your entry was successfully submitted. Thank you! Please wait as you are redirected...</br><img src="url here"></center>');
setTimeout(function () {
window.location.href = ' ';
}, 1000);
</script>

The "entry-content" class in the first line is the main container of your theme (which will likely be a different class for your theme than in mine). What this will do is temporarily show a loading icon (use a animated gif) and the message noted and then the page will reload with all of the updated information.

Thanks for the advice. I will give it a go and see if I can get it to work. Appreciate all the help.