如何基于widgetVar在Primefaces组件中查找和/或覆盖JavaScript？

Question

根据这个问题:使用额外的inputText上传多个文件 我可以通过这种方式使用widgetVar覆盖PrimeFaces元素的JavaScript函数:

PF('fileUpload').jq.fileupload({
    add: function(e, data) {
           ...
         }
    });

现在,我尝试覆盖DataTable中的函数,无法理解我如何引用它？而且,PF(')从chrome调试器控制台返回undefined,所以我无法调试它.我怀疑这是范围的问题,但不知道如何解决它.

Answer 1

你可以使用原型,例如覆盖bindEditEvents就像这样

PrimeFaces.widget.DataTable.prototype.bindEditEvents = function() {
  ....
}

Answer 2

还有更多解决方案。取决于你想走多深。

就我而言，我打算扩展 DataScroller 的功能。

尽管现在回答您的问题为时已晚，但我希望以下解决方案对其他人有所帮助：

解决方案#1 （用其方法扩展整个类）

PrimeFaces.widget.DataScroller = PrimeFaces.widget.BaseWidget.extend({
    init: function(cfg) {
        this._super(cfg);
            
        // only for widget with widgetVar="yourWidgetVar"
        if(cfg.widgetVar === 'yourWidgetVar') {
            this.yourCustomMethod();
        }
    },

    yourCustomMethod: function() {
        // do whatever you prefer here
    }
});

解决方案#2 （针对特定小部件扩展现有方法）

PF('yourWidgetVar').load = function() {

    // do whatever you prefer to extend it here

    // call the generic implementation
    PrimeFaces.widget.DataScroller.prototype.load.call(this, arguments);
};

解决方案#3 （通过原型扩展现有方法）

    const oldLoad = PrimeFaces.widget.DataScroller.prototype.load;

    PrimeFaces.widget.DataScroller.prototype.load = function() {
        oldLoad.apply(this, arguments);
    
        // do whatever you prefer to extend it here

        // in case you need to do it for specific widget. i.e. widgetVar="yourWidgetVar"
            if(cfg.widgetVar === 'yourWidgetVar') {
                // your custom stuff here
            }
    };

解决方案#4 （init组件的重写方法）

if(PrimeFaces.widget.DataScroller) {
    PrimeFaces.widget.DataScroller.prototype.init = function(cfg) {
        PrimeFaces.widget.DeferredWidget.prototype.init.call(this, cfg);

        this.cfg = cfg;

        // this._super(cfg);

        // original init method code without calling _super method

        // apply here your custom code

    }
}