Alert message when field is certain value

Hello,
I am trying to create a popup for when a field is a certain value. I am using SharePoint 2016 Forms Designer. My field is Cancel Request. I put this in the javascript field.
function alert() {
if (fd.field('Cancel_x0020_Request').value() == 'Yes') {
alert("Are you sure you want to cancel");
}
}
fd.field('Cancel_x0020_Request').change(alert);
alert();

Cancel_x0020_Request is the internal name. It is giving me a odd message in the browser.
Capture
Capture2

Is there something I am missing? I have the code in the top of the javascript.

Hello @David_E_Garza,

The name of the function should be unique. And as alert function is already exist, you are getting the error. So you just need to rename the function, e.g. alertUser:

function alertUser() {
if (fd.field('Cancel_x0020_Request').value() == 'Yes') {
alert("Are you sure you want to cancel");
}
}
fd.field('Cancel_x0020_Request').change(alertUser);
alertUser();

Please, post questions regarding Forms Designer to theForms Designer Forum. Thank you!

1 Like

I feel dumb. That worked. Thank you again for your help.

1 Like

when using Plumsail Forms, where do you place this code?
Thanks

Hello @eweiler,

Using Plumsail Forms, you need to add the code to the JavaScript Editor:
image

And you need to slightly change the code, as Plumsail Forms JS API is different from Forms Designer.


fd.spRendered(function() {
    function alertUser() {
        if (fd.field('FieldName').value == 'Yes') {
            alert("Are you sure you want to cancel");
        }
    }
    //cal function on field change
    fd.field('FieldName').$on('change', alertUser);
    //call fucntion on form load
    alertUser();
});

You can find more information in our documentation here.

1 Like

Ok, i put this into the form and I don't get any pop up no matter the value of the field

image

It's a Boolean field, so I changed it, but still same thing. nothing

image

I figured it out. This works! thanks again

image

1 Like

Is it possible to change the font size and color of the alert box?

Hello @adasilva,

Alert box is a system object so you can't change its styling. As an option, you can design a custom confirm box, please find the example here.

Hi Margarita,

How can I redirect users to another page after users press 'OK' on the browsers alert?

 function supererror(){
    if (fd.field('Question_2').value = 'No' && fd.field('Question_3').value == 'No'){
    alert("Sorry, form cannot be completed because...")
    }
 };

fd.field('Question_3').$on('change', supererror)

@DryChips,

You can simply add this line after the alert:

window.location.href = 'https://www.plumsail.com/';

Like this:

    if (fd.field('Question_2').value = 'No' && fd.field('Question_3').value == 'No'){
        alert("Sorry, form cannot be completed because...");
        window.location.href = 'https://www.plumsail.com/';
    }
1 Like

Perfect. thank you! :grinning:

1 Like

Hi Margarita,

I wanted to ask, is it possible to run the code I constructed 'onChange' off the 'Next button' in Wizard Control?

Currently it is set to run onChange of a drop-down field but I think it's better to run onChange of the next button.

 function supererror(){
    if (fd.field('Question_2').value == 'No' && fd.field('Question_3').value == 'No') 
    {
    alert("Custom Message";
    }
    else if (fd.field('Question_2').value == 'Yes' && fd.field('Question_3').value == 'Yes'){
    alert("Custom message");
    window.location.href = "https://en.wikipedia.org/wiki/Main_Page";
    }
 };

fd.field('Question_3').$on('change', supererror)

Hello @DryChips,

Yes, you can run the code on Wizard step change. Please find the code sample here.

Sorry, I don't understand how this code in the link can be implemented in my case.

This code doesn't do anything:

fd.container('Wizard').widget.$on('change', function(newIndex){
    if (fd.field('Question_2').value == 'No' && fd.field('Question_3').value == 'No') 
    {
    alert("Based on the answers you have provided above, you are not required to complete a Termination / Leave-a-Post form for the employee. A termination form is only required if an employee is leaving the Trust, while a leave-a-post form is only required if the employee is leaving one of multiple assignments. If the employee is transferring internally, this assignment change will be picked up via an internal Trac recruitment process or via a transfer form, to be completed by the receiving manager." + newIndex);
    window.location.href = "https://en.wikipedia.org/wiki/Main_Page";
    }
    else if (fd.field('Question_2').value == 'Yes' && fd.field('Question_3').value == 'Yes'){
    alert("Based on the answers you have provided above, you are not required to complete a Termination / Leave-a-Post form for the employee. A termination form is only required if an employee is leaving the Trust, while a leave-a-post form is only required if the employee is leaving one of multiple assignments. If the employee is transferring internally, this assignment change will be picked up via an internal Trac recruitment process or via a transfer form, to be completed by the receiving manager." + newIndex);
    window.location.href = "https://en.wikipedia.org/wiki/Main_Page";
    }

})

@DryChips,

There is a syntax error. For Wizard container it should be on-change instead of change.

Using the code you can detect when user moves between steps. For instance, from the second to third step check field values and redirect user:

fd.container('Container1').widget.$on('on-change', function(prevIndex, newIndex) {
    //detect that user has moved to the third step
    if(newIndex == 2) {
        if (fd.field('Question_2').value == 'No' && fd.field('Question_3').value == 'No'){ 
            alert("Based on the answers you have provided above, you are not required to complete a Termination / Leave-a-Post form for the employee. A termination form is only required if an employee is leaving the Trust, while a leave-a-post form is only required if the employee is leaving one of multiple assignments. If the employee is transferring internally, this assignment change will be picked up via an internal Trac recruitment process or via a transfer form, to be completed by the receiving manager." + newIndex);
            window.location.href = "https://en.wikipedia.org/wiki/Main_Page";
        }
    }
} );
1 Like

Thank you very much! This is exactly what I needed!

1 Like