How to make a custom widget editable only when i click 'Edit' button?

Question

I have created a custom rating widget in openerp using Rateit.

But the widget is always editable, How can i make it editable only when i click 'Edit' button and How do i know it is in readonly mode?

xml

<field name="rating" widget="rating"/>

js

instance.my_module.Rating = instance.web.form.FieldChar.extend({
        template : "rating",
        init: function(field_manager, node){
            this._super.apply(this, arguments);

        },

        start: function() {

            var self = this;

            $('#rateit').rateit({
                value: 0,
                resetable: false
            });
        },
    });

Answer 1

Finally i got it working, here is my code

start: function() {

            var self = this;
            this.field_manager.has_been_loaded.done(function() {
                $('#rateit').rateit({
                    value: 0,
                    resetable: false
                });
                self.field_manager.on("change:actual_mode", self, self.check_actual_mode);
                self.check_actual_mode();
            });

 },

 check_actual_mode: function(source, options) {
    var self = this;
    if(self.field_manager.get("actual_mode")=='view'){
        $('#rateit').rateit('readonly',true);
    }
    else {
        $('#rateit').rateit('readonly',false);
    }
}