spjs.dffs.dlgBox

Forums Dynamic Forms for SharePoint spjs.dffs.dlgBox

This topic contains 20 replies, has 3 voices, and was last updated by  Alexander Bautz 1 day, 20 hours ago.

  • Author
    Posts
  • #15037

    Kasey
    Participant

    I currently have some custom js to display a confirm box and call a function on OK and a different function on Cancel. I’d like to use your spjs.dffs.dlgBox if possible. How would I go about using that with Yes/No buttons instead of Ok, Cancel and calling functions on click of the buttons?

    • This topic was modified 2 years, 6 months ago by  Kasey.
  • #15042

    Alexander Bautz
    Keymaster

    Here is a code snippet, but keep in mind that this alert box is not “blocking” so any running code will not be halted while this dialog is shown:

    spjs.dffs.dlgBox("This is the message, and you can use <span style='font-size:22px'>HTML</span>",false,function(){
        // your OK function
        spjs.dffs.closeDlg();
    },function(){
        // Your cancel function
        spjs.dffs.closeDlg();
    });

    Alexander

  • #15044

    Kasey
    Participant

    Great. Thank you. Is there anyway to force the text to Yes for OK and No for Cancel?

  • #15046

    Alexander Bautz
    Keymaster

    Yes, but I haven’t built in a method to override the text on the “default button”, so you need to put the buttons in the HTML like this:

    spjs.dffs.dlgBox("This is the message, and you can use <span style='font-size:22px'>HTML</span><div style='text-align:center;'><input type='button' value='Yes' onclick='theYesFunction()'> <input type='button' value='No' onclick='theNoFunction()'></div>",false);
    
    function theYesFunction(){
        // the Yes function goes here
        spjs.dffs.closeDlg();
    }
    
    function theNoFunction(){
        // the NO function code goes here
        spjs.dffs.closeDlg();
    }

    Alexander

  • #15048

    Kasey
    Participant

    That works! Thank you!

  • #17004

    Kasey
    Participant

    Is there anyway to use dlgBox on presave and not allow the form to continue to save until the Ok button is clicked? I know this is a “non-blocking” solution but I’m trying to see if there is anyway to use it in conjunction with presave or any other way as the out of the box alert boxes can be blocked but Chrome and aren’t as nice.

    function PreSaveAction() {
    spjs.dffs.dlgBox(“<i class=’fa fa-floppy-o fa-4x iconGood’ aria-hidden=’true’></i><p>Thank you for your submission!<p><p>You will be notified when your request is ready for User Acceptance Testing as well as when it has been deployed to production.<p><p>Feel free to use the My Requests page to view all of your requests and their progress.</p>”,false,function(){
    // your OK function
    spjs.dffs.closeDlg();
    return true;
    });
    return false;
    }

  • #17053

    Alexander Bautz
    Keymaster

    You should be able to use this to let you “pause” the save until OK is pressed:

    var dlgBoxOkClicked = false;
    function dffs_PreSaveAction(){
        if(!dlgBoxOkClicked){
            spjs.dffs.alert({
                "msg":"Your message here - you can use HTML",
                "title":"Your custom dialog title",
                "ok":function(){
                    spjs.dffs.closeDlg();
                    dlgBoxOkClicked = true;
                    // Trigger save again
                    jQspjs("input[id$='diidIOSaveItem']:last").trigger("click");
                }
            });
            return false;
        }
        return true;
    }

    Alexander

  • #17057

    Kasey
    Participant

    PERFECT!!! Thank you!

  • #26051

    becca
    Participant

    Related to my post from yesterday, I have this set up and tried both the trigger.(“click”) and triggerSave and neither makes presaveaction run again, then I can’t click submit again

  • #26057

    Alexander Bautz
    Keymaster

    I did have a bug here in an earlier release – which version of DFFS are you running?

    Alexander

  • #26061

    becca
    Participant

    Backend v4.4.3.58 css v.4.46 spjs.utility v1.328

  • #26073

    becca
    Participant

    Updated to the most recent version and it still is not working

  • #26075

    becca
    Participant

    I’ve swapped a few different save attempts in and none have worked and returned so far.

    
    
    function customCloseFunc() {
        var inff = $("#info").val(); var houu = $("#hours").val();
        if (inff !== "" && houu !== ""){
            setFieldValue('field1', inff); setFieldValue('field2', houu);
            spjs.dffs.closeDlg();
            alrtOKd = true;
            spjs.dffs.processEmailTemplate("email"); //this does run
            //jQspjs("input[id$='diidIOSaveItem']:last").trigger("click");
            //$("input[id$='diidIOSaveItem']:last").trigger("click");
            //spjs.dffs.triggerSave();
            //return true;
        }
        else{
            if (inff === ""){$("#formVal1").show();}else{$("#formVal1").hide();}
            if (houu === ""){$("#formVal2").show();}else{$("#formVal2").hide();}
        }
    }
    
    var alrtOKd = false;
    function PreSaveAction() {
        //
        //just a whole bunch of other checks and emails
        //
        if (getFieldValue('Complete') === true){
            if (!alrtOKd){
                spjs.dffs.alert({
                    "title":"blah",
                    "msg":"important parts are <textarea id='info></textarea> <div id='formVal1'> <input type='number'> <div id='formVal2'> <input type='button' class='spjs-dlg-btnOK' onclick='customCloseFunc' value='Save'> <input type='button' class='spjs-dlg-cancelOK' onclick='spjs.dffs.closeDlg();' value='Cancel Save'>",
                    "noBtn":true
                });
            }
            return false;
        }
        return true;
    }

    Everything else works correctly, just the save and return will not happen.
    *sorry for all the edits, coding in vba too so I kept using ‘ instead of // and messing everything up

    • This reply was modified 4 days, 13 hours ago by  becca.
    • This reply was modified 4 days, 13 hours ago by  becca.
    • This reply was modified 4 days, 13 hours ago by  becca.
  • #26082

    Alexander Bautz
    Keymaster

    Not sure what could cause this – do you see any errors in the developer console? (hit F12 > Console) – please note that the console must be open when you try the save the first time.

    If you don’t see any errors you might have a required field that is not filled in, or you have a field with validation errors. Try creating a tab with ALL the fields visible (by adding a tab with NO selected fields) and see if you have a validation error on one of the fields that do not show in any other tab.

    Alexander

  • #26086

    becca
    Participant

    I have the misc tab set to give me the yellow notification bar for missed required fields and I double checked my js for the only changes made with this addition so that’s not the problem. If it was I wouldn’t get to PreSaveAction in the first place.

    On load

    Resource interpreted as Document but transferred with MIME type
    clienttemplates.js?r…jz4PK%2FeWg%3D%3D:1 image/gif: “http://sharepoint4.company.com/_layouts/15/images/blank.gif?rev=23”

    Resource interpreted as Document but transferred with MIME type image/gif: “http://sharepoint4.company.com/_layouts/15/images/blank.gif?rev=38”

    With both jquery.js:3 and jquery.js:4

    [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user’s experience.

    With jquery.js:4

    and nothing new when I save

  • #26094

    Alexander Bautz
    Keymaster

    It’s hard to tell exactly without looking at it live, but try changing the function name PreSaveAction with dffs_PreSaveAction and see if it helps.

    Alexander

  • #26107

    becca
    Participant

    No dice, didn’t change a thing

  • #26109

    becca
    Participant

    I think the issue is the return false in the PreSaveAction, since other events in the PreSaveAction are running before getting caught on that line. Seems like bad practice. What I’m going to try next is replace the Submit button with a matching clone that triggers the dlg if needed or goes straight to triggerSave otherwise, and see if putting a triggerSave in the dlg btnOK works that way.

  • #26114

    Alexander Bautz
    Keymaster

    Yes, returning false in the PreSaveAction or dffs_PreSaveAction will prevent saving – this is how it is supposed to work – to be able to stop the save in the code. I didn’t notice this when looking at your code, but if you move the return false line up you should be OK:

    var alrtOKd = false;
    function PreSaveAction() {
        //
        //just a whole bunch of other checks and emails
        //
        if (getFieldValue('Complete') === true) {
            if (!alrtOKd) {
                spjs.dffs.alert({
                    "title": "blah",
                    "msg": "important parts are <textarea id='info></textarea> <div id='formVal1'> <input type='number'> <div id='formVal2'> <input type='button' class='spjs-dlg-btnOK' onclick='customCloseFunc' value='Save'> <input type='button' class='spjs-dlg-cancelOK' onclick='spjs.dffs.closeDlg();' value='Cancel Save'>",
                    "noBtn": true
                });
                return false;
            }
        }
        return true;
    }

    Alexander

  • #26124

    becca
    Participant

    Got it, I moved one bracket out of place. Oh the joys of coding, one character off but not in an error-throwing way can cause so much headache. This works, now just to add this button press to my redirection navigation exceptions and I’m done with this story.

    Thanks for getting my morning off to a good start.

  • #26134

    Alexander Bautz
    Keymaster

    I’m glad we got this figured out.

    Alexander

You must be logged in to reply to this topic.