【问题标题】:Ready/Init event for Kendo Upload?Kendo Upload 的 Ready/Init 事件?
【发布时间】:2014-06-27 21:51:17
【问题描述】:

我们使用 MVC 构建器来上传剑道,但有时我们需要做这样的事情:

$("#someUploadId").data("kendoUpload").setOptions({
    //some options
});

(我知道您可以通过包装器设置大部分内容,但有时我们需要自定义 javascript 来处理特殊情况。)

但是,如果我把它放在 doc.ready 中,它会失败,因为它没有找到 kendoUpload 属性。这是一个时间问题,因为在文档准备就绪时,kendoUploader 仍在初始化并且还不存在。我可以使用 setTimeout 等待一秒钟,它会起作用,因为这给了剑道控制时间来初始化,但是以这种方式使用 setTimeout 显然是一种技巧,可能不可靠。

通常像这样的库有某种事件表明控件已准备好/已初始化。我还没有找到任何表明 kendoUpload 类似结构的文档。如何确定 KendoUpload 何时准备就绪?

【问题讨论】:

    标签: kendo-ui kendo-asp.net-mvc


    【解决方案1】:

    很遗憾,没有这样的活动。

    但是,从 MVC 构建器生成的 JS 只是简单地包装在 jQuery 就绪块中,因此您需要做的就是将需要访问小部件的代码放在该小部件的构建器指令下方的 jQuery 就绪块中。

    这将起作用,因为所有准备好的块都是按顺序执行的,并且一旦调用插件方法,小部件本身就准备好了(没有异步初始化)。

    您也可以尝试自己实现该事件,例如通过创建一个初始化对象:

    var deferred = $.Deferred();
    var kendoInitializer = {
        widgets: [],
        total: 0,
        waitFor: function (name, number) {
            this.widgets[name] = number;
            this.total += number;
        },
        deferred: deferred,
        promise: deferred.promise(),
        resolveOne: function (name) {
            console.log(name, "initialized", this.total);
            this.removeOne(name);
            if (this.total <= 0) { // could also resolve per widget type etc.
                this.deferred.resolve();
            }
        },
        removeOne: function (name) {
            if (this.widgets.hasOwnProperty(name)) {
                this.widgets[name] -= 1;
                this.total -= 1;
            }
        }
    };
    

    然后让每个小部件向初始化器注册自己:

    kendo.ui.Widget.fn.init = function (originalFn) {
        return function () {
            originalFn.apply(this, arguments);
            // mark one widget as initialized;
            // pass this.options.name and resolve per widget type
            kendoInitializer.resolveOne(this.options.name);
        };
    
    }(kendo.ui.Widget.fn.init);
    

    然后像这样使用它:

    kendoInitializer.waitFor("DropDownList", 1);
    kendoInitializer.waitFor("Window", 1);
    kendoInitializer.promise.done(function () {
        console.log("all widgets initialized");
    });
    

    这只是一个原型,需要您声明要等待的小部件数量;可能有办法解决这个问题。

    (demo)

    【讨论】:

    • 谢谢,我对此进行了测试,它可以工作(对于简单的情况)。不幸的是,在我的情况下,有一些奇怪的问题导致较低的 doc.ready 无法按顺序执行,我怀疑是因为我们推迟了对 $ 的评估
    • 我明白了;如果这仍然是一个问题,您可以尝试使用类似于我添加到答案中的解决方案来解决这个问题
    • 我的脚本包含在 jquery 下面,所以它没有被延迟,因为 jquery 到那时已经加载了,但是 jquery 上面的内联构建器被延迟了。我最终为解决方法所做的是在构建器对附加设置进行函数调用之后添加一个 doc.ready 脚本块(在@section javascriptIncludes 上方)。订单将是 Kendo MVC 构建器,&lt;script&gt;additionalSetup();&lt;/script&gt;&lt;script src="...jquery-1.9.1.min.js"&gt;。确保 both MVC builder inline 和我的 AdditionalSetup 被延迟(defer 脚本确保它们按顺序执行)。
    • 我没有意识到 doc.ready 是确定性的,因为它们是按顺序执行的,所以谢谢你,因为它帮助我找到了解决方案。如果其他人出现并且对我所说的延迟评估感到困惑,我指的是:mrclay.org/2010/11/14/using-jquery-before-its-loaded
    【解决方案2】:

    您可以尝试使用dataBound 事件。来自文档

    当小部件绑定到来自其数据源的数据时触发。

    因此,当数据被绑定并绘制到 DOM 时,就会触发此事件。我不确定您需要它来做什么,但我们正在使用它向行中的某些单元格添加自定义 CSS,如果我们使用 Kendo 模板等,这将是一团糟。

    请注意,每当数据被重新绘制到 DOM 时,即会在表格被过滤、排序等时触发。

    【讨论】:

    • 是的,我以前用过这个,但在这种情况下,我们需要在网格拉取数据之前设置选项。不过,也许您的回答会对其他有类似情况的人有所帮助。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-06-26
    • 2013-01-27
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多