Thread Details
  • State Not Answered
  • Replies 18 replies
  • Subscribers 373 subscribers
  • Views 8061 views
  • Users 0 members are here
Forum Actions
Related

Waiting to execute javascript once page is fully loaded in Sugar 7

Mike Solomon
I need to hide a button in record view depending on the status

The problem I have is that the page needs to be fully loaded before I run the javascript to hide it

How can I do this?

I tried $( document ).ready(function() { but that doesnt work

Any ideas will be gratefull received

Sugar 7 is beginning to seriously depress me :(




  • 0
    Hi Mike, here can you review how Sugar add validation in RecordView with JS:
    http://support.sugarcrm.com/02_Documentation/04_Sugar_Developer/Sugar_Developer_Guide_7.1/20_UI_Model/30_Views/Examples/Adding_Field_Validation_to_the_Record_View/

    In the initialize method, can you add a custom function...

    Regards,
    Esteban Schmirman
    GrowIT SRL
    SugarCRM Gold Partners



  • 0
    Esteban

    I have looked at that but is not helping me for this (might not be understanding)

    I can use it for validation but it fires before page is loaded so I am having problems hiding fields/buttons as they aren't loaded when my code fires

    If I'm missing something please point it out

    Thanks
  • 0
     It looks like code inside the $(document).ready() function will load as soon as the DOM is loaded, but...
    $(document).on('load', function() {...})
      or
    $(window).load(function() {..})
    execute later and may behave differently according to this and the browser flavour... 
  • 0
    Thanks

    I tried :

    $(document).on('load', function() {alert(1)})         
    $(window).load(function() {alert(2)})

    neither are triggered :(

    I think I may need to use $.when( to check if page is loaded but can't work out how at the moment

    This is incredibly frustrating 

    Is it only me that is finding doing the simplest things in sugar 7 is really difficult?

    I asked someone from Sugar and was pointed to the Adding Field Validation document but that is worse than useless for what I'm trying todo



  • 0 in reply to Mike Solomon
    I agree that it is really difficult to do something very familiar before.I feel it is almost a new world in Sugar7 =_=

    I'll following this topic.
  • 0 in reply to Mike Solomon
    Mike,

    The url Esteban posted is actually really useful, if you need to do validation on a field. The secret seems to be the naming convention of fields. You can find more examples on the 7.2 version: http://support.sugarcrm.com/02_Documentation/04_Sugar_Developer/Sugar_Developer_Guide_7.2/20_UI_Mode... 

    I also just built a small gist example for you, based on the Cases module, that triggers when the priority of a Case set to High.
    Write the content of the gist https://gist.github.com/esimonetti/192f02635651e8b96d91 into "custom/modules/Cases/clients/base/views/record/record.js" and execute a repair/rebuild from the administration area. Then refresh your browser on a case's view and you should see a message getting logged on your browser's console.

    Cheers,
    Enrico Simonetti
    InsightfulCRM Australia

    --

    Enrico Simonetti

    Sugar veteran (from 2007)

    www.naonis.tech


    Feel free to reach out for consulting regarding:

    • API Integration and Automation Services
    • Sugar Architecture
    • Sugar Performance Optimisation
    • Sugar Consulting, Best Practices and Technical Training
    • AWS and Sugar Technical Help
    • CTO-as-a-service
    • Solutions-as-a-service
    • and more!

    All active SugarCRM certifications

    Actively working remotely with customers based in APAC and in the United States

  • 0 in reply to Mike Solomon
    Enrico

    I agree it is very useful for validation but it is not working for what I am trying todo which is hide a button depending on a value.

    Once I have got it working I will expand it to hide fields as well

    I tried adapting your code as follows

      myCustomLogicOn: function()    {
            
            if(this.model.get('phone_office') == '7777')
            {
                // log something on the console
                console.log('executing  my custom action');
                $('[name="validate_postal_code"]').hide();
              
            }
        },


    The function is executed but the button is not hidden

    I suspect it is running before the page is fully loaded

    I have proved that the code  $('[name="validate_postal_code"]').hide(); works by adding it to the click of another button 

    Am I missing something?


  • 0 in reply to Mike Solomon
    Hi Mike,    It seems that what you are trying to do might be better approached using the Sugar Logic on Field Dependency.  You can configure this through studio by defining a field (e.g. Cases Description) to be Visible if equal($priority, "P1").  This will hide the Description field automatically if you set the Priority to "High".    If you do need a more complex rules, you can use the following snippet (based on Enrico's sample code):    ({      extendsFrom: 'RecordView',        initialize: function(options)      {          this._super('initialize', [options]);      },        _render: function()      {          this.myCustomLogicOnCases();          this._super('_render');      },        myCustomLogicOnCases: function()      {          // when case priority is High...          if(this.model.get('priority') == 'P1')          {              var thepanel = '';              var thefield = '';              _.each(this.meta.panels, function(pn, idx_pn) {                  if(thepanel == '')                  {                          _.find(pn.fields, function(fld, idx_fld) {                                  if(fld.name == 'description') {                                          thefield = idx_fld;                                          return true;                                  }                          });                          if(thefield != '') {                                  thepanel = idx_pn;                          }                  }              });                if(thefield != '' && thepanel != '')              {                  // remove the meta                  this.meta.panels[thepanel].fields.splice(thefield, 1);              }          }      },        _dispose: function()      {          this._super('_dispose');      }  })      Basically, the field will be hidden by removing the fields metadata completely before rendering.  Note that you might have to handle when the fields change since this will only work when you first load the Case Record view.    Hope this helps,  Felix  InisightfulCRM Australia
  • 0 in reply to Mike Solomon
    Hi Mike,    One way to do this is to manipulate the metadata before rendering the Record View.  You can remove the buttons you want to hide before rendering.      Using Enrico's sample code, in the example below, the "Share" button will be hidden in Cases Record View if the Priority is set to High:    ({      extendsFrom: 'RecordView',        initialize: function(options)      {          this._super('initialize', [options]);      },        _render: function()      {          this.myCustomLogicOnCases();          this._super('_render');      },        myCustomLogicOnCases: function()      {          // when case priority is High...          if(this.model.get('priority') == 'P1')          {              var thebutton = '';              var theidx = '';              // find the buttons index for the share button              _.find(this.meta.buttons, function(bn, idx) {                  if(bn.name == 'main_dropdown') {                          thebutton = idx;                          _.find(bn.buttons, function(bbn, idx_bbn) {                                  if(bbn.name == 'share') {                                          theidx = idx_bbn;                                          return true;                                  }                          });                          return true;                  }              });                if(thebutton != '' && theidx != '')              {                  //remove the meta                  this.meta.buttons[thebutton].buttons.splice(theidx, 1);              }          }      },        _dispose: function()      {          this._super('_dispose');      }  })    Hope this helps.    Cheers,  Felix  InsightfulCRM Australia
  • 0 in reply to Mike Solomon
    Felix

    Thanks that works to delete a button

    Really helpful

    I'd still like to know if there's a way to run the JavaScript when the page is fully loaded as hiding the button was an example

    I also need to add buttons using JavaScript, hide fields and other things

    Any ideas?