kendo method:destroy 解决有些在kendo.all.js 的js 库里报错问题
首先,不得不承认,kendo UI 是个不错的东西,特别对于一个前端开发到行不足的程序猿来说。而在我们使用过程中貌似还是会遇到各种奇怪的问题。比如我们会经常用到对一些控件进行重赋值。
destroy
在kendo的configration 的Medhod 的描述是:
Prepares the widget for safe removal from DOM. Detaches all event handlers and removes jQuery.data attributes to avoid memory leaks. Calls destroy method of any child Kendo widgets.
其主要用来对之前的初始化信息进行销毁。防止再次初始化时报错。
当然如果我们仅仅是简单的使用其显示数据的话,一般是不会出现什么问题的。但是当我们如果想运用其更为复杂的一些功能接口时。要求就比较严谨点。
我们要注意的是kendo 的控件一般是不允许对其多次初始化。比如:在项目中,我们可能用到它的grid 或者 scheduler。 而且里面会有一些 功能接口。如:
<!DOCTYPE html>
<html>
<head>
<base href="http://demos.telerik.com/kendo-ui/scheduler/events">
<style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style>
<title></title>
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.1118/styles/kendo.common-material.min.css" />
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.1118/styles/kendo.material.min.css" />
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.1118/styles/kendo.material.mobile.min.css" /> <script src="//kendo.cdn.telerik.com/2016.3.1118/js/jquery.min.js"></script>
<script src="//kendo.cdn.telerik.com/2016.3.1118/js/kendo.all.min.js"></script>
<script src="//kendo.cdn.telerik.com/2016.3.1118/js/kendo.timezones.min.js"></script>
<link rel="stylesheet" href="../content/shared/styles/examples-offline.css">
<script src="../content/shared/js/console.js"></script>
</head>
<body>
<div id="example">
<div id="scheduler"></div>
<div class="box wide">
<h4>Console log</h4>
<div class="console"></div>
</div>
</div>
<script>
$(function() {
function scheduler_dataBinding(e) {
kendoConsole.log("dataBinding");
} function scheduler_dataBound(e) {
kendoConsole.log("dataBound");
} function scheduler_save(e) {
kendoConsole.log("save");
} function scheduler_remove(e) {
kendoConsole.log("remove");
} function scheduler_cancel(e) {
kendoConsole.log("cancel");
} function scheduler_change(e) {
var start = e.start; //selection start date
var end = e.end; //selection end date
var slots = e.slots; //list of selected slots
var events = e.events; //list of selected Scheduler events var message = "change:: selection from {0:g} till {1:g}"; if (events.length) {
message += ". The selected event is '" + events[events.length - 1].title + "'";
} kendoConsole.log(kendo.format(message, start, end));
} function scheduler_edit(e) {
kendoConsole.log("edit");
} function scheduler_add(e) {
kendoConsole.log("add");
} function scheduler_moveStart(e) {
kendoConsole.log("moveStart");
} function scheduler_move(e) {
kendoConsole.log("move");
} function scheduler_moveEnd(e) {
kendoConsole.log("moveEnd");
} function scheduler_resizeStart(e) {
kendoConsole.log("resizeStart");
} function scheduler_resize(e) {
kendoConsole.log("resize");
} function scheduler_resizeEnd(e) {
kendoConsole.log("resizeEnd");
} function scheduler_navigate(e) {
kendoConsole.log(kendo.format("navigate:: action:{0}; view:{1}; date:{2:d};", e.action, e.view, e.date));
} $("#scheduler").kendoScheduler({
date: new Date("2013/6/13"),
startTime: new Date("2013/6/13 7:00"),
height: 400,
timezone: "Etc/UTC",
views: [
"day",
{ type: "week", selected: true },
"month",
"agenda",
"timeline"
],
selectable: true,
dataBinding: scheduler_dataBinding,
dataBound: scheduler_dataBound,
save: scheduler_save,
remove: scheduler_remove,
edit: scheduler_edit,
add: scheduler_add,
cancel: scheduler_cancel,
change: scheduler_change,
moveStart: scheduler_moveStart,
move: scheduler_move,
moveEnd: scheduler_moveEnd,
resizeStart: scheduler_resizeStart,
resize: scheduler_resize,
resizeEnd: scheduler_resizeEnd,
navigate: scheduler_navigate,
dataSource: {
batch: true,
transport: {
read: {
url: "//demos.telerik.com/kendo-ui/service/tasks",
dataType: "jsonp"
},
update: {
url: "//demos.telerik.com/kendo-ui/service/tasks/update",
dataType: "jsonp"
},
create: {
url: "//demos.telerik.com/kendo-ui/service/tasks/create",
dataType: "jsonp"
},
destroy: {
url: "//demos.telerik.com/kendo-ui/service/tasks/destroy",
dataType: "jsonp"
},
parameterMap: function(options, operation) {
if (operation !== "read" && options.models) {
return {models: kendo.stringify(options.models)};
}
}
},
schema: {
model: {
id: "taskID",
fields: {
taskID: { from: "TaskID", type: "number" },
title: { from: "Title", defaultValue: "No title", validation: { required: true } },
start: { type: "date", from: "Start" },
end: { type: "date", from: "End" },
startTimezone: { from: "StartTimezone" },
endTimezone: { from: "EndTimezone" },
description: { from: "Description" },
recurrenceId: { from: "RecurrenceID" },
recurrenceRule: { from: "RecurrenceRule" },
recurrenceException: { from: "RecurrenceException" },
ownerId: { from: "OwnerID", defaultValue: 1 },
isAllDay: { type: "boolean", from: "IsAllDay" }
}
}
}
}
});
});
</script> </body>
</html>
如:上面code中的 scheduler_change()方法,我们在运用在会经常用它来实现切换日期时对scheduler的值进行重新初始化。但是如果我们直接对$("#scheduler").kendoScheduler({}) 进行调用时,可能会出现有些功能接口在kendo.all.js 里报错。
但如果我们在重新初始化前能调用一下destroy 方法。则可以避免这些问题。
var scheduler = $("#scheduler").data("kendoScheduler");
scheduler.destroy();
对之前的初始化进行销毁。
$("#scheduler").kendoScheduler({
kendo method:destroy 解决有些在kendo.all.js 的js 库里报错问题的更多相关文章
- 解决Android Studio Conflict with dependency 'com.android.support:support-annotations'报错
解决Android Studio Conflict with dependency 'com.android.support:support-annotations'报错 在Android Studi ...
- 【技术贴】解决支付宝充值信用卡还款跳转到网上银行报错Error 404 - Not Found
声明 : 本文在 GFDL 1.2 下发布,本文出处光大银行信用卡 http://bbs.090989.com/forum-186-1.html http://androidgao.blogspot ...
- JS 调试中常见的报错的解决办法
报错:Uncaught SyntaxError: Unexpected token o in JSON at position 1 at JSON.parse (<anonymous>) ...
- 解决FAT32格式U盘安装Windows 10时的报错(错误代码:0x8007000D)
一.现象描述 使用UltraISO软碟通将 Windows 10 version 1909 刻录到U盘内来安装系统. 从U盘启动安装过程中,报错如下: "Windows 无法打开所需的文件 ...
- 解决Vue项目打包之后放到nginx下刷新就报错404的问题
最近跟着某机构的教学视频敲了一遍vue项目,但是在windows环境下部署的时候就懵逼了放到nginx下正常跑没问题,但是刷新之后就报404错误 前端项目构建vue 脚手架版本 是@vue/cli 4 ...
- Windows串口之解决包含setupapi.h还提示找不到符号报错
关于 本文演示环境: win10 1909 + VS2017 1. 错误信息 明明已经添加了头文件setupapi.h 和 库 setupapi.lib, 却还是提示报错,报错信息: 1>C:\ ...
- [异常解决] Keil安装好nRF51822开发环境,运行DEMO报错:Error:“GPIOTE_CONFIG_NUM_OF_LOW_POWER_ENVENTS” is undefined
1.问题描述 when compiling "ble_app_proximity" exampled by Nordic, it indicates errors: "D ...
- [Android]通过js方法回调部分native报错 Web Console: Uncaught TypeError: Object [object Object] has no method 'xxx'
在android4.2以前,注入步骤如下: webview.getSetting().setJavaScriptEnable(true); class JsObject { public String ...
- 解决方法:loadrunner 场景下执行webservice脚本是---报错10492 Error: Exception was raised when calling per-process-init function in extens
在vug下执行时,脚本无异常,但是在controller下执行时报下面错误,网上查了下,解决方法千奇百怪,但无一可行. 分析了下错误,似乎是初始化进程有关.想到rts中的设置习惯时以线程方式执行. 遂 ...
随机推荐
- vue render function
vue render function https://vuejs.org/v2/guide/render-function.html { // Same API as `v-bind:class`, ...
- [TJOI2013]单词 AC自动机
题面: 洛谷 题解: 很久之前做的题了,只不过之前一直90....最近才发现是哪里写错了. 我们对字符集建AC自动机. 首先考虑一个暴力的做法,把文章当做一个长串,直接在自动机上跳,但是我们会发现,这 ...
- Strategy Pattern ava设计模式之策略模式
简介 在策略模式(Strategy Pattern)中,一个类的行为或其算法可以在运行时更改.这种类型的设计模式属于行为型模式.简单理解就是一组算法,可以互换,再简单点策略就是封装算法. 意图 定义一 ...
- 【MediaElement】WPF视频播放器【1】
一.前言 前两天上峰要求做一个软件使用向导,使用WPF制作.这不,这两天从一张白纸开始学起,做一个播放演示视频的使用向导.以下是粗设计的原型代码: 二.效果图 三.代码 前台代码: < ...
- 【BZOJ5415】【NOI2018】归程(克鲁斯卡尔重构树)
[NOI2018]归程(克鲁斯卡尔重构树) 题面 洛谷 题解 我在现场竟然没有把这道傻逼题给切掉,身败名裂. 因为这题就是克鲁斯卡尔重构树的模板题啊 我就直接简单的说一下把 首先发现答案就是在只经过海 ...
- 【Luogu1912】【NOI2009】诗人小G(动态规划)
[Luogu1912][NOI2009]诗人小G(动态规划) 题面 洛谷 题解 原来\(NOI\)这么多神仙题... 考虑一个极其明显的\(dp\) 设\(f[i]\)表示前\(i\)个句子产生的最小 ...
- 扔几道sb题
1.给定一个长度为N的数列,A1, A2, ... AN,如果其中一段连续的子序列Ai, Ai+1, ... Aj(i <= j)之和是K的倍数,我们就称这个区间[i, j]是K倍区间. 你能求 ...
- 洛谷 P2195 HXY造公园 解题报告
P2195 HXY造公园 题目描述 现在有一个现成的公园,有\(n\)个休息点和\(m\)条双向边连接两个休息点.众所周知,\(HXY\)是一个\(SXBK\)的强迫症患者,所以她打算施展魔法来改造公 ...
- 第13章 MySQL服务器的状态--高性能MySQL学习笔记
13.1 系统变量 -- 服务器配置变量 MySQL通过SHOW VARIABLES SQL命令显示许多系统变量. 13.2 状态变量--SHOW STATUS SHOW STATUS 命令会在一个 ...
- 解题:POI 2015 Pieczęć
题面 发现好像没有什么好做法,那就模拟么=.= 以印章左上角的'x'为基准,记录印章上'x'的相对位置模拟.记录相对位置是因为可能有这种情况↓ 直接模拟是会漏掉的=.= #include<cst ...