Prevent refresh once form is submitted

[ricslabb03]

I have created a button that will set a flag element if the form doesn't have an id and then submit the form to get an id. However, I need to prevent the page from reloading after the submit as I will be reloading it later.

I looked at some of the examples in http://fabrikar.com/forums/index.php?wiki/form-javascript-objects/

However I didn't find anything on preventing the refresh. This is my code:

requirejs(['fab/fabrik'], function () {

    Fabrik.addEvent('fabrik.form.submit.end', function (form) {

        var elements = form.formElements;
        var flag = elements.get('video_investigations___no_id').get('value');
       
        if (flag === "1")
        {
            form.result = false;
        }
       
    });

});

It runs without errors (I used dev tools), but (I think that) form.result = false is incorrect as it doesn't submit the form's values.

Is there a function I can call to prevent the refresh?

Richard

 

[cheesegrits]

Try just returning false, "return false;" instead of "form.result = false;"

-- hugh

 

[cheesegrits]

Actualy, no, try using fabrik.form.submit.start, instead of .end. And set form.result = false.

-- hugh

 

[ricslabb03]

Hi Hugh,

Actualy, no, try using fabrik.form.submit.start, instead of .end. And set form.result = false.

This suggestion prevents the form from refreshing (which is correct), but it also prevents the form from being applied and the values saved to the db. Is there another way to save, but prevent the refresh?

 

[Bauer]

If I'm reading this correctly, you want the form to be applied (to update the id) and return to the same form - which is the same thing that happens with an 'Apply' button, no?

So why not just add an 'Apply' button to the form (but hide both the Save (submit) and Apply buttons via javascript if no_id) - and have the javascript for your no_id button trigger a click on the Apply button?

You don't fully explain why the id would not be set - but I'm assuming it is the PK id that is not yet set when a new record is added.

If that is the case, better yet...
Add an 'Apply' button to the form, and in the 'Form Processing' tab of the form configuration, if you set both 'Ajax validation' and 'Toggle Submit' to Yes, you can prevent the normal 'Save' (submit) button from being enabled by adding a validation rule to your flag element (Must be 0) and set 'Must validate' to Yes. Then you really don't need to make that flag element a button, as the 'Apply' button is already there (and the Save button will be disabled) - just make it a hidden field element [int(1)] instead. E.g. If the default value of the flag element to 1, on Apply change the flag value to 0. (Or, to make more sense in English, change the name of the flag element from 'no_id' to 'has_id' and make the default 0 (validation: must be 1) and change 'has_id' to 1 when applied.)

...or maybe you don't even need a flag element?
After adding an Apply button to the form and setting both 'Ajax validation' and 'Toggle Submit' to Yes, just try adding a 'not empty' 'Must validate' validation rule to the id element.

I haven't tested any of this but hopefully one of the 3 suggestions will work. (I'd try the last one first.)

 

[ricslabb03]

Sorry for the confusion.

The reason that I did not want the refresh is because I have a button in my form that opens up a popup form that is filtered by the record's id. On new, the form doesn't have an id and so when I press that button the popup form is not filtered. I need to be able to save the record before the popup form is displayed so that it can be filtered correctly.

 

[Bauer]

Sorry for the confusion.

The reason that I did not want the refresh is because I have a button in my form that opens up a popup form that is filtered by the record's id. On new, the form doesn't have an id and so when I press that button the popup form is not filtered. I need to be able to save the record before the popup form is displayed so that it can be filtered correctly.

If the "button...that opens a popup form" is an Fabrik element that you added - in the element configuration just set the 'Access' option for 'Form (add)' to 'Special' (or 'Nobody' if you have a Nobody usergroup) and it won't show in a newly added record.

 

[ricslabb03]

You can do that for sure, but my button is a button I created in php in the group intro and I would like to display it on new as well as edit (that is first prize). At the moment it notifies the client to save first, but I would like it to automatically save (on new) when you press the button and the popup window opens. I don't want the page to refresh, because the popup will go out of scope if there is a refresh.

Here is the code for the button:

echo '<button id="callhistory" type="button" class="btn btn-info" onclick="VICallHistory();">Add/Edit/Del Call History</button>';

where VICallHistory() is the function that opens up the popup form.

In case you are interested, I placed the button in the group's intro text, because I am modifying the default repeat group functionality in fabrik to instead add repeat group records in a popup window instead of adding the default way.

 

[Bauer]

You'll have to better explain this - because I'm still lost.
What does this popup contain - and how is it related to the form or group that is pops up from? (Is the popup a list or a form - and how is it linked to the parent form?)
Is it actually linked (as a repeat group) via a join in the Fabrik list configuration - or are you just trying to create a repeat group (linked records) without actually creating the join in the Fabrik list?

Normally, a popup has some link (e.g 'parent_id') to the form it 'pops up' from. And if there is any link to the parent form you'll need an id from that form, no? But if you update the ID by submitting the parent form elsewhere, without also refreshing the form - then that parent form becomes just as 'out of scope" as the popup. (I guess I need to understand what you mean by 'out of scope' and how that scope is created.)

The only way I can think of making that work would be if the link between the form and the popup was on user_id - and you use the user element in both tables so the popup only contains that user's records ( and there is no need for a PK id link).

I know it's early and my brain might not be all there just yet but I'm just not understanding the entire concept or 'end-goal' here and why the need to re-invent the wheel instead of working with the tools that Fabrik already gives you.

 

[ricslabb03]

What does this popup contain - and how is it related to the form or group that is pops up from?

The popup contains a list of all the calls for a specific investigation. The specific investigation is the form that it pops up from.

Is it actually linked (as a repeat group) via a join in the Fabrik list configuration...?

The same list that pops up is actually joined via a list join, yes. I use that join to only display a readonly version of the call history. (It is in that repeat group intro that I placed the button).

But if you update the ID by submitting the parent form elsewhere, without also refreshing the form - then that parent form becomes just as 'out of scope" as the popup. (I guess I need to understand what you mean by 'out of scope' and how that scope is created.)

I would like to apply the form when I click that button (to open the popup) if the parent form doesn't have an id (ie on new). I would like the popup to display after the apply code has run. From my understanding, the popup will not show if the page is refreshed.

Maybe I should explain practically how this is to work (I know that helps me).

The user will create a new investigation. She will want to add call history from correspondence with the client (emails, phone calls etc). She clicks on the button at the top of the call history group. The investigation form will save an id and the popup will open, filtering on that id. The user will add a new call and then save the call. The call will save the investigation id as well (I know how to do that). From the call history list I have created a button that will apply the parent window (the investigation). With the apply, the parent form will save and then refresh and the newly created call will be displayed in a readonly format in the repeat group in the investigation form (which I mentioned earlier -- 2nd paragraph).

Are you still confused?

 

[Bauer]

I'm always better at understanding things once I see it in action, so yeah I'm still a bit foggy.

But how about if you add a field that will act as a flag for if the record was just added (int(1) - default to 0).
Then add some javascript to the form's onload event that will check that flag value - and if it is zero and the id value is not empty (meaning this must be a newly added record), then trigger a click on your popup button. You'll need something to change that flag element to '1' so it doesn't occur in future loads of the form - you can figure out the rules for that or how it should be done. (i.e. maybe some php added to the popup, triggered when the popup is saved?)

I do something similar in my current project. I'm not a big fan of the way repeat groups work either - but nor am I really big on using popups. So what I do is show a page with a Fabrik list containing the repeats - but filtered to the parent record selected for editing, which is shown in a fabrik form module above the list, at the top of the page. That was the only way I could think of to come up with a page that had a formview/listview combination.

 

[ricslabb03]

Do you mean to use a content plugin to show the list in the form intro or use some kind of iframe? I am keen to hear more of your idea of how to solve this problem, but I think you would probably have to save the parent record before you use your method (to get the id)?

Thanks for your help, it is really appreciated.

 

[Bauer]

No - just the opposite.
In my case the related tables are a 'Membership' record and the "repeat groups" are the list of 'Member Organizations / Facilities' for that Membership. (Though the list is not joined via the Fabik list configuration, so they are not really seen as 'repeat groups' by Fabrik. The form and the list is only kept 'linked' by sharing a common user_id,)

The menu link for the page is configured to show a list view of the 'Member Organizations / Facilities' filtered to that user. Then, above the list, I use a module content plugin to show the form (the parent 'Membership' record) for that user_id.

So initially the list will show as 'No records' - but, via the form in the module above the list, a new repeat group (Member Organizations / Facilities) can be added and the list is refreshed when that form is submitted. The form for adding a new 'Member Organizations / Facility' (repeat group) shows in a popup by using a databasejoin element linked to the repeat groups configured to use the Add option on front end. (You don't see that in my screen snip because I use a cascading dropdown to first make the user select a 'facility type' - but that is how you could do it. You can hide all but the Add button in the dbj element via css if you want to eliminate any confusion regarding what it's there for.)
(See attachments)

In your case, the 'Your Membership' form (shown in a module) would be the Investigation and the 'Member Organizations / Facilities' would be the Call History.

Note: Using a few jQuery tricks, I moved the form's Submit button and nested a few other elements to change the appearance of the form - but the elements all work as normal. I also added some javascript to toggle display of the module content so that just the heading is displayed - if the user wants to just see/work with the 'Member Organizations / Facilities' in their 'Member Organizations / Facilities' list.