overriding Save button : after ajax validation save editView form

Hello everybody!!

You may have noticed that this thread is a duplicate one of Sugar 7 bwc overriding Save button to add ajax but i don't know why but the forum did a mess with it and repeated everything several times (Hey @Sugar Staff, i didn't find somewhere to talk about it).

So, here is again my problem, with better construction and further precision.

What i want :

I want sugar to check if the assigned user already have meetings planned WHEN the current user clicks on Save button.

What i did :
I've overrided the Save button by doing this custom code under custom/modules/Meetings/editviewdefs.php :

array (            'customCode' => '<input title="{$APP.LBL_SAVE_BUTTON_TITLE}" id ="SAVE_HEADER" accessKey="{$APP.LBL_SAVE_BUTTON_KEY}" class="button primary" onclick="SUGAR.meetings.fill_invitees();return validationPlanification();document.EditView.action.value=\'Save\'; document.EditView.return_action.value=\'DetailView\'; {if isset($smarty.request.isDuplicate) && $smarty.request.isDuplicate eq "true"}document.EditView.return_id.value=\'\'; {/if} formSubmitCheck();" type="button" name="button" value="{$APP.LBL_SAVE_BUTTON_LABEL}">',
          ),

you can see it is calling a js function, which is below and is defined under customjs.js (this last is included in editviewdefs too)

function validationPlanification(){ if($("#status").val()=="Planned"){
  var user_id = $("#assigned_user_id").val();
  var user_name = $("#assigned_user_name").val();
 
  var duration_h = $("#duration_hours").val();
  var duration_m = $("#duration_minutes").val();
  var date_start = $("#date_start_date").val()+" "+$("#date_start_hours").val()+":"+$("#date_start_minutes").val();
 
  var href = $(".moduleTitle").find('h2 a').attr('href');//trouver le lien du record
  if (href != undefined){
   var idx = href.indexOf('record');//trouver où se situe le mot "record"
   var bean_id = href.substr(idx+7);//chopper l'id
  }else{
   var bean_id = '';
  }

  var ajax = $.ajax({
   url: "http://&lt;Sugarbase&gt;/index.php?entryPoint=validateAvailability",
   type: "POST",
   data: { userid : user_id, beanid : bean_id, date : date_start, h : duration_h, m : duration_m},
   success: function(data){
    //console.log(data);
    if (data === "false"){
     console.log("nok");
     alert("L'utilisateur "+user_name+" a déjà d'autres rendez-vous de prévus sur cette plage horaire!");
     //on ne peut pas sauvegarder
     return false;
    }
    if (data === "true"){
     console.log('ok');
     //return true;
     return check_form('EditView');
    }
   },
   error: function(){
    //console.log(data);
    console.log("SQL Failure");
   }
  });
}
}

you can see this function is doing an ajax call to a custom entrypoint. this works (tested it by setting some log at the beginning of the entry point) this entrypoint is querying the base to know if the assigned user already have a meeting set. It returns $is_available = true if the user does not have a meeting. else, it returns$is_available = false.
This works, i've set some console.log(data) when the ajax call is a success.

Then, you can see i'm testing the data retrieved. if data is true, so Sugar must save the current editview form. and if it is false, i think i'll throw an alert.

What is not working :
Everything works fine until i try to save the editview form : my return check_form('EditView') does not work, neither a simple "return true".

Do you have any idea on that?

Thanks a lot for the long reading, and your time.
Gaëlle


Parents
  • The way I do this sort of thing is have a custom js file

    In it I have a function check_form which overwrites the standard sugar one so you don't need to play with editviewdefs apart from including the custom js file

    something like

    function check_form(formname) {
    /*
      * replace main check_form standard sugar validation plus your changes
      */

    //standard validation
    if (ValidateForm(formname) == false) return false;

    //your validation
    if (yourfunction() == false) return false;

    return true;
    }

    If you are doing an ajax call for validation I would do a synchronous call 

    Hope this helps
Reply
  • The way I do this sort of thing is have a custom js file

    In it I have a function check_form which overwrites the standard sugar one so you don't need to play with editviewdefs apart from including the custom js file

    something like

    function check_form(formname) {
    /*
      * replace main check_form standard sugar validation plus your changes
      */

    //standard validation
    if (ValidateForm(formname) == false) return false;

    //your validation
    if (yourfunction() == false) return false;

    return true;
    }

    If you are doing an ajax call for validation I would do a synchronous call 

    Hope this helps
Children
  • Hi Mike,
    First of all, thank you for your time and your help!
    This seems really simple!

    I would like to be sure :
    I'll just have to edit my customjs.js, to add the function check_form('EditView') and inside, just write if (mycustomValidation () == false) return fasle;
    mycustomValidation being still the same function wrote into the same file and with a synchronous ajax and that is all??

    It seems to be so simple, i'm really impressed, and kinda doubting (sorry, not that i'm questionning your skills and knowledge, but i'm so amazed!! I've ran this issue from the beginning of the week, so..)

  • Ha! i forgot : i have a question for you :
    How do you trigger the custom check_form function? do you call it when button is onclick/onsubmit state ?

    Thanks
  • Everything is simple when you know how :)

    Took me ages to work out how todo it

    You don't need to trigger it as the standard save button calls check_form and your custom function overrides the standard sugar function

    Give it a try and let me know how you get on
  • Thanks a lot Mike!!!!

    It WOOORKKKKKSSSS !!!!!!

    I'll post the response with the total code (except the sql query), but I need to just i don't know, kiss your feet, because Mike, you saved my days! :)

    Again, Thanks!!!
  • SO, this thread can be closed, it is totally SOLVED (yaaaayyy!)
    Thanks to @Enrico Simonetti and @Mike Solomon who gave me a lots of advices, and more awesome : working advices!

    Here is the code for those who would run in this problem :

    Don't override Save button custom code in custom/modules/Meetings/metadata/editviewdefs.php : the Save button will check for the function check_form('EditView'), all by itself.

    Just override check_form() function in a custom js file :
    in custom/modules/Meetings/js/customjs.js (create one, the folder name and the file name could be anything), write those two functions :

    function validationPlanification(){
    if($("#status").val()=="Planned"){
         var user_id = $("#assigned_user_id").val();
         var user_name = $("#assigned_user_name").val();
     
         var duration_h = $("#duration_hours").val();
         var duration_m = $("#duration_minutes").val();
         var date_start = $("#date_start_date").val()+" "+$("#date_start_hours").val()+":"+$("#date_start_minutes").val();
     
         var href = $(".moduleTitle").find('h2 a').attr('href');//trouver le lien du record
         if (href != undefined){
               var idx = href.indexOf('record');//trouver où se situe le mot "record"
               var bean_id = href.substr(idx+7);//chopper l'id
          }else{
               var bean_id = '';
          }

          var ajax = $.ajax({
               url: "http://&lt;baseSugar&gt;/index.php?entryPoint=validateAvailability",
               async : false,
               type: "POST",
              data: { userid : user_id, beanid : bean_id, date : date_start, h : duration_h, m : duration_m},
              success: function(data){
                    if(data > 0){
                         alert("L'utilisateur "+user_name+" a déjà d'autres rendez-vous de prévus sur cette plage horaire!");
                     }
              },
              error: function(){
                  console.log("SQL Failure");
              }
          });
       return ajax.responseText;
     }
    }


    function check_form(formname) {
    /* OLD VERSION : not making required fields required states. */
       if (validationPlanification() > 0){
            return false;
        }else{
             return true;
       }
    /* END OLD VERSION*/
    /*NEW VERSION so cool!*/
        if (typeof(siw) != 'undefined' && siw  && typeof(siw.selectingSomething) != 'undefined' && siw.selectingSomething)
           return false;
        return validate_form(formname, '');

        /*launching assigned_user availability validation*/
        if (validationPlanification() > 0){
             return false;
        }else{ 
             return true;
         }
    /*END NEW VERSION*/
    }

    The function validationPlanification will do a synchronous ajax call to a php file which i've defined as a custom entryPoint (because it was the only solution i found)

    This php file runs a sql query which sort all meetings'id (EXCEPT the current meeting id) related to the assigned user and whose date_start and date_end are between the date_start define by the user and the date_start + the duration gave by the user.

    Then, i count the number of rows of the result. and i return this number of rows to the ajax call.
    When i got my data, if the number is > 0, i throw an alert to the sugar user. Then, after the ajax call, and because it is synchronous, i return the responseText.


    Now for the custom check_form(), i just run the validationPlanification function. this one returns me the number of rows. I check if this one is >0, if yes, i return false : the editView form won't be submitted and saved. If else, it will.

    And that is all. Thanks a lot to this wonderful sugar community!!!
    ---------
    EDIT 18h : Because of the previous version (becareful, in the code snippet, i've edited the "old version" and gave you the new one), i couldn't have my required field launching some errors and tunring red.
    But @Mike Solomon saved the day by helping me out with that.

    In fact, before launching your own custom validation function, you have to copy/paste the snippet of code present into the check_form(form_name) function under the file ./include/javascript/sugar_3.js.
    Code edited! :)


    That's all folks!
    Have a nice week end!






  • Mike, i finally have another question to ask :

    Ok, i've overwrote the save button by my function... But all my fields which are standard required fields or custom and addToValidate does not shout when saving.
    Aka, the subject of the meeting is required, but if it is empty, when clicking Save, no message, no red is throw, and the meeting is still saved...

    I understand by overriding the check_for function, i've erased every check it does... but i would like at least the required fields to work as they were planned for...

    Could you help me on that, please?
  • sorry I mislead you a bit in my code

    I told you to include if (ValidateForm(formname) == false) return false;

    I suspect that gave you a javascript error as you wont have that function :(

    I have a custom function ValidateForm

    instead use

    if(typeof(siw)!='undefined'&&siw&&typeof(siw.selectingSomething)!='undefined'&&siw.selectingSomething)return false;

    if ( validate_form(formname) == false ) return false

    I got this from include/javascript/sugar_3.js



  • Yes, i saw this strange one, but thought it was the code i had to replace with my custom validation... 

    here is what i wrote after you, and it is not working, even if i load the script (i launched a console.log promptly after the $.getScript )

    function check_form(formname) {
       /* custom function to check the form then save */

       /* launching standrad fields validation*/
       $.getScript("../../../../include/javascript/sugar_3.js", function(){      if(typeof(siw)!='undefined'&&siw&&typeof(siw.selectingSomething)!='undefined'&&siw.selectingSomething)return false;
            if ( validate_form(formname) == false ) return false;
       });

       /*launching assigned_user availability validation*/
       if (validationPlanification() > 0){
            return false;
       }else{ 
            return true;
       }
    }

    Any idea? i've checked the sugar_3.js (i'm on it since 15h), but well, my brain must be yoghurt, i don't understand a lot of this file...

    Thanks
  • Don't bother with the  $.getScript

    Just try

    if(typeof(siw)!='undefined'&&siw&&typeof(siw.selectingSomething)!='undefined'&&siw.selectingSomething)return false;
          if ( validate_form(formname) == false ) return false;

    It should work