Help getting catalog item to submit after modal button selected

Moedeb
Tera Guru

So I have a catalog item that when the requestor clicks on the Submit button a modal pops up with some terms and conditions, then if they don't agree the item doesn't get submitted and if they do agree it is submitted (well at least it should be)

 

So the issue I have is that when they click the 'I Agree' button on the modal popup, they then have to click the 'Submit' button again on the catalog item to actually log the request.

 

I had it all working and don't believe I changed anything to make it stop working, but can't get it to work correctly again, so help would be much appreciated 🙂

 

So this is what I have:

Catalog Client Script on the catalog item

Type - onSubmit

Applies on Catalog Item view - true

Applies on requested items - false

Applies on catalog tasks - false

UI Type - All

 

Script:

function onSubmit() {
    if (typeof spModal != 'undefined') {

        if (g_scratchpad.isFormValid) {
            return true;
        }
        spModal.open({
            'backdrop': 'static',
            'keyboard': false,
			
            message: 'Text goes here',
            title: 'Terms and Conditions',
            'buttons': [{
                    label: 'I do not agree',
                    cancel: true
                },
                {
                    label: 'I agree',
                    primary: true,
                }
            ],
        }).then(function(confirmed) {
            g_scratchpad.isFormValid = true;
            var actionName = g_form.getActionName();
            g_form.submit(actionName);
            return true;

        });
        g_scratchpad.isFormValid = false;
        return false;
    } else {
        var gm = new GlideModal();
        gm.setTitle('Error');
        gm.renderWithContent('Something has gone wrong');
    }
}

 

Thanks in advance.

1 ACCEPTED SOLUTION

Tai Vu
Kilo Patron
Kilo Patron

Hi @Moedeb 

It should be because of this line below from your script, the getActionName API returns nothing.

 

var actionName = g_form.getActionName();

 

 

The correct place should be before the Modal get open, right after the user click Submit button.

Let's try my adjustment below.

 

function onSubmit() {
    if (typeof spModal != 'undefined') {

        if (g_scratchpad.isFormValid) {
            return true;
        }
		var actionName = g_form.getActionName(); //move to here

        spModal.open({
            'backdrop': 'static',
            'keyboard': false,

            message: 'Text goes here',
            title: 'Terms and Conditions',
            'buttons': [{
                    label: 'I do not agree',
                    cancel: true
                },
                {
                    label: 'I agree',
                    primary: true,
                }
            ],
        }).then(function(confirmed) {
            g_scratchpad.isFormValid = true;
            g_form.submit(actionName);
            return true;

        });
        g_scratchpad.isFormValid = false;
        return false;
    } else {
        var gm = new GlideModal();
        gm.setTitle('Error');
        gm.renderWithContent('Something has gone wrong');
    }
}

 

 

 

 

Cheers,

Tai Vu

View solution in original post

9 REPLIES 9

Amit Gujarathi
Giga Sage
Giga Sage

HI @Moedeb ,
I trust you are doing great.
Here's a modified version of your script with explanations:

function onSubmit() {
    // Check if the spModal is defined (for Service Portal)
    if (typeof spModal != 'undefined') {

        // Check if the form has already been validated
        if (g_scratchpad.isFormValid) {
            return true; // Submit the form
        }

        // Open the modal
        spModal.open({
            'backdrop': 'static',
            'keyboard': false,
            message: 'Text goes here',
            title: 'Terms and Conditions',
            'buttons': [
                {
                    label: 'I do not agree',
                    cancel: true
                },
                {
                    label: 'I agree',
                    primary: true,
                    click: function() {
                        // Set form as valid and submit
                        g_scratchpad.isFormValid = true;
                        g_form.submit(); // Directly submit the form
                    }
                }
            ],
        });

        // Set form as invalid initially
        g_scratchpad.isFormValid = false;
        return false; // Prevent form submission for now
    } else {
        // Fallback for non-Service Portal (like standard UI)
        var gm = new GlideModal();
        gm.setTitle('Error');
        gm.renderWithContent('Something has gone wrong');
    }
}

Was this answer helpful?


Please consider marking it correct or helpful.


Your feedback helps us improve!


Thank you!


Regards,


Amit Gujrathi



@Amit Gujarathi unfortunately still having the same issue 😞

 

As some troubleshooting I did create a very basic test catalog item and my original script worked perfectly (which makes sense because it did work initially with the catalog item I want it for).

 

The catalog item does have a number of variable sets and so doing more troubleshooting I removed them all, tested the catalog item with the script and it worked fine. I then added the variable sets one at a time until the script stopped working. So once I found a variable set that appeared to break it, I removed it, tested again, then added others and it also broke.

I added the first one that 'broke' the script on it's own and the script worked fine. So it doesn't appear to be a particular variable set. Do you know if there is a limit for how many variable sets client scripts will work with? I'm only using 5 anyway with only a couple of questions in each.   

Moedeb
Tera Guru

@Vishal Birajdar & @Amit Gujarathi 

I've done some testing again and I've found that the terms and conditions prompt works 100% fine with all but one question, a date field.

 

I can disable just the one date field on the item and the terms and conditions works as expected, as soon as I put the date field back on when I select 'I agree' it doesn't submit.

 

Any ideas why?

Tai Vu
Kilo Patron
Kilo Patron

Hi @Moedeb 

It should be because of this line below from your script, the getActionName API returns nothing.

 

var actionName = g_form.getActionName();

 

 

The correct place should be before the Modal get open, right after the user click Submit button.

Let's try my adjustment below.

 

function onSubmit() {
    if (typeof spModal != 'undefined') {

        if (g_scratchpad.isFormValid) {
            return true;
        }
		var actionName = g_form.getActionName(); //move to here

        spModal.open({
            'backdrop': 'static',
            'keyboard': false,

            message: 'Text goes here',
            title: 'Terms and Conditions',
            'buttons': [{
                    label: 'I do not agree',
                    cancel: true
                },
                {
                    label: 'I agree',
                    primary: true,
                }
            ],
        }).then(function(confirmed) {
            g_scratchpad.isFormValid = true;
            g_form.submit(actionName);
            return true;

        });
        g_scratchpad.isFormValid = false;
        return false;
    } else {
        var gm = new GlideModal();
        gm.setTitle('Error');
        gm.renderWithContent('Something has gone wrong');
    }
}

 

 

 

 

Cheers,

Tai Vu

Moedeb
Tera Guru

@Tai Vu Thank you very much, works perfectly. Was so close myself all this time lol

 

No wonder why people get so frustrated scripting!