Question

Detect in Form With Javascript that Were in Designer or Monitor Page

Forms Version 11 Self-Hosted

Updated March 29

asked on March 28

Hey all,

Is there a way in a classic LF form to detect in the document.ready() if we're in the forms designer (and it's display the form preview on the right as normal) or in the Monitor page looking at history? I have a form that redirects to another form under certain conditions. When I'm in the designer it redirects the preview window to that other form. Also, when troubleshooting a form submission in Monitor history, clicking the submitted form redirects to the other form preventing me from viewing what was submitted. Any idea how to prevent my Javascript redirect in these 2 scenarios?

1 0

Answer

SELECTED ANSWER

replied on March 28 • Show version history

In the past I've just done this by checking the URL.

For example, I've used the following to check if a form is being viewed in design mode

if(window.top.location.href.toLowerCase().indexOf('design') == -1) {
    // not design mode
}

To check if it is being viewed from monitoring/instance history, you can check for 'submission', 'submission/history', 'history' or something along those lines.

In general, I prefer to exclude certain paths rather than checking for a positive match, and I convert to lowercase first to make it a case-insensitive comparison, but you could really go either way.

let path = window.top.location.href.toLowerCase();

if(path.indexOf('design') == -1 && path.indexOf('history') == -1) {
    // do something when not in designer or monitoring
}

If you want to be extra careful to avoid issues if someone does something unexpected like putting the word "design" or "history" in the link under Process Options, then you could check for more specific text like "/forms/design/" and "/submission/history/"

You can get the path from the url you see in the browser since this is using window.top

3 0

replied on March 28

Fantastic! Thanks guys for your help.

1 0

Replies

replied on March 28

I usually just check to see if the input element on any single-line field is undefined or not. If not undefined, then you know you are looking at the live form. If it is undefined, then you know you are looking at a read-only version of the form (such as from the Monitor page or archival to the repository.

$(document).ready(function() {
  
  if ($('#q1 input').val() != undefined) {
    console.log('Form is Live');
  }
  else {
    console.log('Form is Read-Only');
  }
  
});

3 0

replied on March 28 • Show version history

One thing to watch out for with this approach is that it is possible to have a read-only user task that still has submit/approve/deny buttons.

When the entire user task is marked as read-only using the checkbox under the form selection, as opposed to just making specific fields/sections read only it wouldn't be flagged as a "live" form even though the user can interact with the buttons, save drafts, etc.

2 0

replied on March 28

Good point Jason! Thank you for explaining that. I had meant to explain that in my original post and got distracted. haha

1 0

replied on March 28

I can definitely relate. 9 times out of 10 I go back and edit posts 2 or 3 times to add all the "extra" stuff I didn't include on the first pass lol.

1 0

replied on March 29

Not relevant to you as you solved this with the classic designer, but in the new designer we will be adding process and step information to the LFForm object so you know exactly where your form is being loaded. No ETA yet but its a known requirement!

3 0

You are not allowed to follow up in this post.

Question

Question

Detect in Form With Javascript that Were in Designer or Monitor Page

Answer

Replies

Sign in to reply to this post.