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

46scxncf  于 2023-02-02  发布在  Java
关注(0)|答案(2)|浏览(104)

根据这个问题:Multiple file upload with extra inputText我可以通过使用widgetVar覆盖PrimeFaces元素的JavaScript函数,方法如下:

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

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

cbeh67ev

cbeh67ev1#

您可以使用原型,例如覆盖bindEditEvents将如下所示

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

huwehgph2#

还有几个解决方案,取决于你想走多深。
在我的例子中,我打算扩展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

    }
}

相关问题