Change Event within the Record List View

Hi Everyone, 

I'm looking for a way of capturing the Change Event within the Quote Stage Drop Down list on the Quote Record List i.e. www.example.com/#Quotes

Quote List Drop Down

I have been able to successfully detect the change using the hasChanged method ie.:

self.model.hasChanged('quote_stage')

However this is when I extend the "EditablelistbuttonField" and using the _validationComplete method. 

I would like to detect the Change event before the user clicks "Save". 

I have been able to do this successfully on the Record View of the Quote i.e.

/custom/modules/Quotes/clients/base/views/record/record.js

using the following: 

this.model.once( "sync", function() {
this.model.on("change:quote_stage",this.checkQuoteFieldsOnChangeQuoteStage,this);
},this
);

I have tried the same method within the Quotes Editablelistbutton.js however the Change Event does not get bound to the quote_stage.

I expect that I need to extend a different Sugar function. Hopefully it is as simple as that. 

Any help would be greatly appreciated. 

Parents Reply Children
  • Thanks Jeroen, 

    This is what I initially thought too, however after some testing with the following code I was still not able to fire on the change event of my control. I have added this code to the:

    custom/modules/Quotes/clients/base/views/recordlist/recordlist.js

    ({

        /* because 'Quotes' already has a recordlist view, we need to extend it */
        //This code is not yet in use, this is just initial code to test binding to the correct event.
        extendsFrom: 'RecordlistView',

        initialize: function(options){

            console.log('This is Quotes RecordlistView');

            this._super('initialize', [options]);

            this.model.on('change:quote_stage', this.checkQuoteFieldsOnChange,this);

        },

        checkQuoteFieldsOnChange: function(){
            console.log("This is the OnChange Event firing for the quote_status field");
            console.log(this.model.get('quote_stage'));
            console.log(this.model.previous('quote_stage'));


        },

    })

    Initially I had "extendsFrom: 'RecordListView'" and realised it needed to be a lowercase "L", i.e. extendsFrom: 'RecordlistView'. With this problem fixed.

    Now, this only way I can capture the change event on the "quote_stage" is by using: 

            this.events['change [name=quote_stage]'] = 'checkQuoteFieldsOnChange';

    As the 

            this.model.on('change:quote_stage', this.checkQuoteFieldsOnChange,this);

    Will not fire, So I'm not sure if this is the recommended way to do this or not.

    I have also noticed that I can not access the rows values using:

            console.log(this.model.get('quote_stage'));
            console.log(this.model.previous('quote_stage'));

    They return as 'undefined' Is the model still valid when working with the Recordlist View?

    Thanks for your help. 

  • Fantastic Francesca, this is really helpful and I'm sure I will be able to use this method with other projects. I always appreciate your contribution to my posts.