Thread Details
  • State Not Answered
  • Replies 3 replies
  • Subscribers 353 subscribers
  • Views 1018 views
  • Users 0 members are here
Forum Actions
Related

how to extend DashletView?

Manson ho

I have extended a RecordView and it works perfectly.

SugarPro/custom/modules/XXX/clients/base/views/record/record.js

({
    extendsFrom: 'RecordView',

    initialize: function (options) {
        this._super('initialize',[options]);
        this.model.on('sync', this.changeField, this);
    },

    changeField: function() {

        var temp_fields = ['active_intergrations_c'];              
        var accountId = this.model.get("client_tech_stack_accountsaccounts_idb");

        $.ajax({
            url: "rest/v10/connectedappsapi/getactiveintegrations",
            data: { "firmId": accountId },
            dataType: "json",
            type: "POST",
            success: _.bind(function (response) {
                if (response && response.status === "success") {
                    if (!_.isEmpty(response.data)) {                        
                        this.model.set('active_intergrations_c', response.data);                       
                    }
                } else {                    
                    app.alert.show('message-id', {
                        level: 'info',
                        messages: 'Unable to get Active Integrations data!.',
                        autoClose: true
                    });
                }
            }, this)
        });
    },   
});


However, when I try to extend the DashletView, I find that the JavaScript is not loading. Any suggestions would be appreciated.
SugarPro/custom/modules/XXX/clients/base/views/recorddashlet/recorddashlet.js

({
    extendsFrom: 'DashletView',

    initialize: function (options) {
        this._super('initialize', [options]);
        this.collection.on('sync', this.render, this);
        console.log('dashlet initialize.');
    },

    render: function () {
        this._super('render');

        debugger;
        // Render the integration data in the dashlet
        var temp_fields = ['active_intergrations_c'];
        var accountId = this.model.get("client_tech_stack_accountsaccounts_idb");
        console.log('dashlet 2');

        $.ajax({
            url: "rest/v10/connectedappsapi/getactiveintegrations",
            data: { "firmId": accountId },
            dataType: "json",
            type: "POST",
            success: _.bind(function (response) {
                if (response && response.status === "success") {
                    if (!_.isEmpty(response.data)) {                       
                        this.model.set('active_intergrations_c', response.data);                       
                    }
                } else {
                    app.alert.show('message-id', {
                        level: 'info',
                        messages: 'Unable to get Active Integrations data!.',
                        autoClose: true
                    });
                }
            }, this)
        });
    },
});


SugarCRM Version 12.0.1 (Build 298 E) (Q2 2022)

Parents
  • 0

    Hello,  

    I can see your post and I give you some information to solve your query.

    To update the textbox active_intergrations_c by calling the API when the Record View Dashlet loads, you’ll need to ensure that your custom dashlet JavaScript is properly extending the base dashlet and that it includes the necessary logic to perform the API call on load. Here’s a general approach to achieve this:

    * Extend the Base Dashlet: Make sure your custom dashlet JavaScript extends the base RecordViewDashlet. This can be done by setting extendsFrom in your custom dashlet definition.

    ({
    extendsFrom: 'RecordViewDashlet',

    initialize: function(options) {
    this._super('initialize', [options]);
    // Additional initialization if needed
    },

    loadData: function(options) {
    // Call the API to update the textbox when the dashlet loads
    this._updateTextbox();
    },

    _updateTextbox: function() {
    // Perform the API call to update the textbox 'active_intergrations_c'
    // Handle the API response and update the textbox accordingly
    }
    })

    * Load Data on Initialization: Override the loadData function to call your API when the dashlet initializes. This function is where you can make the API call to fetch and set the data for active_intergrations_c.
    * Handle API Response: In your _updateTextbox function, handle the API response and update the textbox value. You may need to use the model.set method to update the model with the new value.
    * Debugging: Use browser developer tools to debug and ensure that the JavaScript file is loaded and that the loadData function is called when the dashlet loads.
    * Clear Cache: After making changes, clear the SugarCRM cache and your browser cache to ensure that the latest files are being used.
    * Check Permissions: Verify that the file permissions are correct and that the SugarCRM system can access your custom JavaScript files.

    I hope my suggestion is helpful for you.

Reply
  • 0

    Hello,  

    I can see your post and I give you some information to solve your query.

    To update the textbox active_intergrations_c by calling the API when the Record View Dashlet loads, you’ll need to ensure that your custom dashlet JavaScript is properly extending the base dashlet and that it includes the necessary logic to perform the API call on load. Here’s a general approach to achieve this:

    * Extend the Base Dashlet: Make sure your custom dashlet JavaScript extends the base RecordViewDashlet. This can be done by setting extendsFrom in your custom dashlet definition.

    ({
    extendsFrom: 'RecordViewDashlet',

    initialize: function(options) {
    this._super('initialize', [options]);
    // Additional initialization if needed
    },

    loadData: function(options) {
    // Call the API to update the textbox when the dashlet loads
    this._updateTextbox();
    },

    _updateTextbox: function() {
    // Perform the API call to update the textbox 'active_intergrations_c'
    // Handle the API response and update the textbox accordingly
    }
    })

    * Load Data on Initialization: Override the loadData function to call your API when the dashlet initializes. This function is where you can make the API call to fetch and set the data for active_intergrations_c.
    * Handle API Response: In your _updateTextbox function, handle the API response and update the textbox value. You may need to use the model.set method to update the model with the new value.
    * Debugging: Use browser developer tools to debug and ensure that the JavaScript file is loaded and that the loadData function is called when the dashlet loads.
    * Clear Cache: After making changes, clear the SugarCRM cache and your browser cache to ensure that the latest files are being used.
    * Check Permissions: Verify that the file permissions are correct and that the SugarCRM system can access your custom JavaScript files.

    I hope my suggestion is helpful for you.

Children
  • 0 in reply to Ryan Manus

    hi Ryan,

    Thank you very much for the suggestion.

    I've updated my file as per your instructions:


    ({
    extendsFrom: 'RecordViewDashlet',

    initialize: function (options) {
        this._super('initialize', [options]);
        console.log('initialize.');
    },

    loadData: function(options) {
        // Call the API to update the textbox when the dashlet loads
        this._updateTextbox();
        console.log('loadData.');
    },

    _updateTextbox: function () {      
        console.log('_updateTextbox');    
    }

});


    I've also checked the file permissions:
    -rw-rw-r-- 1 xxx xxx  439 Apr 11 10:50 recorddashlet.js
-rw-rw-r-- 1 xxx xxx 7284 Apr  2 15:31 recorddashlet.php


    I performed a SugarCRM quick repair, cleared the browser cache, and refreshed the page. Then, I removed the dashlet and added it again. Upon clicking on an account and viewing the dashlet in Sugar, I opened the web developer tools, but nothing was printed on the console. It seems like the custom JavaScript is still unable to load.

    I'm wondering if the filename - recorddashlet.js - matters.

    Thank you
    Manson