Adding my custom client validations

This topic contains 10 replies, has 2 voices, and was last updated by  Joe McShea 1 month ago.

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #1877

    mar1
    Participant

    Dear Joe,

    I am stuck on how to add my custom javascript validations when clicking on Save buttons. whatever I do, the form closes when the sharepoint and SPEF are OK even though my functions return false. If I use normal SharePoint forms without SPEF, preSaveAction works fine as well as as other tricks. The issue is only when SPEF is loaded in the form.

    My code below explain my last trial: I tried to grab the old preSaveItemfunction and called my validations before using the following code, even when my function returns false in my new PreSaveItem, the new/edit forms close. Could please advice on how to introduce my custom validations with SPEF to cancel the save action when there are errors in my custom validation:

    function AttachToSPEFPreSaveItem() {
    console.log( “AttachToSPEasyFormPreSaveAction …” );

    if (typeof (PreSaveItem) !== ‘undefined’)
    {

    var original2PreSaveItem = PreSaveItem;
    PreSaveItem = function () {
    var myFormValidationResult = null;

    try {
    myFormValidationResult = validateMyForm();
    console.log(” myFormValidationResult: ” + myFormValidationResult)
    } catch (e) { console.log(” myFormValidationResult Exception: ” + e); }

    if(myFormValidationResult)
    {
    console.log(” my validators are OK. go ahead and check what you had to check …”)
    var origResult = original2PreSaveItem();
    console.log(” origResult: ” + origResult);
    return origResult;
    }
    else
    {
    console.log(“my validators are not OK. don t save !!!”)
    return false;
    }

    };
    }
    else
    {
    // just to make sure I am grabbing the function after it is defined, normally it should not go here
    setTimeout(function(){console.log( “trying again AttachToSPEasyFormPreSaveAction …” ); AttachToSPEasyFormPreSaveItem();},200);
    }
    }

    function validateMyForm()
    {
    return false;
    }

    thx.

    Marouane

    • This topic was modified 3 months ago by  mar1.
    #1879

    Joe McShea
    Keymaster

    In general, you do custom validation with SPEasyForms exactly the same as you do custom validation in SharePoint without SPEasyForms. That means that you want to put your custom validation in a function call PreSaveAction, not PreSaveItem. PreSaveItem is defined by Microsoft in init.js and should not be mucked with. It will call PreSaveAction if it’s defined.

    Since PreSaveAction is undefined by default, you don’t have to worry about the kind of monkey patching you’re trying to do above (i.e. get the original method, do your stuff, call the original method, etc.). Just define the function and return false to cancel form submission and true to allow form submission. So for instance, if I add a script editor with the following code:

    <script type="text/javascript">
    PreSaveAction = function() {
        return window.location.search.indexOf("PreSaveAction=true") > -1;
    }
    </script>
    

    This function will always prevent form submission unless you tack “&PreSaveAction=true” onto the URL and refresh. After which it will allow submission.

    So, to summarize:

    • Don’t muck with PreSaveItem.
    • Define PreSaveAction instead.
      • Return true to allow submission.
      • Return false to prevent submission.

    Joe

    • This reply was modified 3 months ago by  Joe McShea.
    • This reply was modified 3 months ago by  Joe McShea.
    • This reply was modified 3 months ago by  Joe McShea.
    • This reply was modified 3 months ago by  Joe McShea.
    • This reply was modified 3 months ago by  Joe McShea.
    #1882

    Joe McShea
    Keymaster

    This is obviously a bit of do as I say, not as I do, because SPEasyForms itself does the kind of monkey patching you’re doing above to replace PreSaveItem. The reason is that if I overrode PreSaveAction, then if you wanted custom validation you’d need to monkey patch PreSaveAction or lose my custom validation, which would mean that validation isn’t exactly the same with and without SPEasyForms. So that’s why I do PreSaveItem, but you should do PreSaveAction.

    Joe

    #1888

    mar1
    Participant

    Hi,

    Actually I have tried PreSaveAction function first before going for an adventure with PreSaveItem.

    With a standard SharePoint 2013 Edit/New forms, PreSaveAction works.

    PreSaveAction does not work once I change the form to SPEF form, actually the PreSaveAction function is called when I Save the form but it has not effect on the saving action and it quits the new form.

    FYI, I am using the latest version of SPEF. Plz give it a try and confirm to me if you can reproduce the issue. I have some pressure adding some custom validations and I can’t go back and not use SPEF 🙂

    Thx Joe

    Marouane

    #1889

    mar1
    Participant

    Hi Joe,

    Did you have a chance to reproduce the issue? I have just tried again and I confirm the behavior I described. Looking forward for your feedback.

    thx

    Marouane

    #1890

    Joe McShea
    Keymaster

    Hi Marouane,

    I tested the code I posted above with the latest SPEasyForms before I posted it, and it works like a charm for me. In other words, I cannot reproduce what you’re seeing. I definitely did have a bug that caused the behavior you’re describing in 2018.01, which I fixed in 2018.02.

    Now I did my testing it in SharePoint online, not SharePoint 2013. I’ll try it in 2013 sometime this weekend, but I’m not optimistic that I’ll be able to reproduce the issue you’re seeing in 2018.02. I’ll let you know either way of course.

    If you can, send me the complete PreSaveAction code that isn’t working and I’ll take a look at it and test with it specifically.

    Joe

    • This reply was modified 2 months, 4 weeks ago by  Joe McShea.
    #1892

    mar1
    Participant

    Hi Joe,

    My function is as simple as:

    function PreSaveAction()
    {
    console.log(‘in PreSaveAction’);
    return false;
    }
    and I have double checked again, I am using version 2018.02 of SPEF. I even used fiddler to see all the loaded resources by the browser. As far as the version is concerned, I am using 2018.02, the sandbox solution, the one provided by default on the home page.

    I have also tested this in two complete sharepoint farms, and same issue, i see the browser console the log i put in my function ‘in PreSaveAction’ but the saving continues and it quits the page.

    I have no clue what s the cause, could be there are many different compilations of SPEF 2018.02 !? :s

    Mar 1

    #1893

    mar1
    Participant

    Hi Joe,

    I am using SharePoint 2013 on-premise not the cloud, this could explain the difference.

    This is said, I have debugged the SPEF javascripts and narrowed down the problem to the following: you are calling SPClientForms.ClientFormManager.SubmitClientForm(opt.formId) in the preSaveItem in script jquery.SPEasyForms.min.js; this call fires the submit even if it is in the if statement !!! The tests that come after this call are worthless. I am not sure why you have added this test before calling this.highlightValidationErrors(opt);

    Below is the modified function which worked for my case, I d love to have your feedback because I don’t know the ideas behind the test you have added and hence there will be side effects for other scenarios that I don’t have in my test.

    /*********************************************************************
    * Called on submit. Overridden from core.js to allow containers to
    * perform actions on submit (like highlight tabs with validation errors
    * and select the first tab with validation errors).
    *
    * @returns {bool} – true if the submit should proceed, false if it should
    * be cancelled.
    *********************************************************************/
    preSaveItem: function () {

    console.log(‘jquery.SPEasyForms.min.js – preSaveItem: function () – …’);
    var opt = $.extend({}, $.spEasyForms.defaults);
    var result = true;

    if (typeof (SPClientForms) !== ‘undefined’ &&
    typeof (SPClientForms.ClientFormManager) !== ‘undefined’ &&
    typeof (SPClientForms.ClientFormManager.SubmitClientForm) === “function”) {
    //if (SPClientForms.ClientFormManager.SubmitClientForm(opt.formId)) {
    this.highlightValidationErrors(opt);
    result = false;
    //}
    }
    else {
    return this.highlightValidationErrors(opt);
    }

    $.spEasyForms.utilities.resizeModalDialog();
    console.log(‘SPEF preSaveItem: ‘+ result);
    return result;
    },

    #1895

    Joe McShea
    Keymaster

    Hi Marouane,

    I am calling that method, because it validates the form. If I don’t validate the form before highlighting validation errors, then I have no way of knowing which tabs or hidden content contains errors. I determine that by looking for the validation error messages that SharePoint puts on the page, and those messages are put into the page by SubmitClientForm.

    But I’ve been doing it this way since the first release for SharePoint 2013, and I still don’t see the behavior you’re seeing? i.e. when I return false from PreSaveAction, the form doesn’t submit? I’m not sure what the difference could be? Maybe language specific?

    Joe

    • This reply was modified 2 months, 3 weeks ago by  Joe McShea.
    #1898

    Joe McShea
    Keymaster

    Hi Marouane,

    Sorry to have left this thread dormant so long. I have now seen the bug in 2018.02. Not sure how I missed it before other than it is fixed in the head of my source control and somehow I was testing that when I thought I was testing the release.

    Anyway, I do have it fixed, but I want to try and improve my fix by not overriding PreSaveItem or calling SubmitClientForm at all. I have had this problem before in previous versions of SPEasyForms, and fixed it before. And as they say, the definition of insanity is doing the same thing over and over again and expecting different results.

    I have an idea of what I want to do, and its so simple that I feel a little stupid for not trying that in first place. One way or the other, this should be fixed in 2018.03. I’m just not sure when I’ll get that released, but it should be pretty soon.

    Thanks,
    Joe

    #1911

    Joe McShea
    Keymaster

    Hi Marouane,

    This is fixed in 2018.03, sorry it took so long to get to it.

    Joe

Viewing 11 posts - 1 through 11 (of 11 total)

You must be logged in to reply to this topic.

Scroll to top