MindFusion:在JavaScript Scheduler中自定义表格标题的两种方法

在这篇博文中,我们将向你展示如何在MindFusion Scheduler for JavaScript中定制表格上出现的标题。你可以使用同样的技术来改变日历的用户界面上出现的任何字符串或格式。

在这篇博文中,我们将向你展示如何在MindFusion Scheduler for JavaScript中定制表格上出现的标题。你可以使用同样的技术来改变日历的用户界面上出现的任何字符串或格式。我们将通过本地化文件做到这一点。下面是最终应用程序的截图。

MindFusion:在JavaScript Scheduler中自定义表格标题的两种方法

当你下载试用版的JavaScript scheduler或JavaScript包时,你会看到一个名为 “本地化 “的文件夹。那里有JSON和JS文件,代表日历用户界面的标题和格式化字符串。它们都可以用来定制日历。

I. 使用 JavaScript 本地化文件

"strings": {   "newFormHeader": "New Class",   "editFormHeader": "Edit Class",   "newRecurrenceFormHeader": "New Recurrence",   "editRecurrenceFormHeader": "Edit Recurrence",   "cueFormHeader": "Cue items",   "dateCaption": "Date",   "datesCaption": "Dates",   "subjectCaption": "Subject",   "startTimeCaption": "Start time",   "endTimeCaption": "End time",   "allDayEventCaption": "All day event",   "reminderCaption": "Reminder",   "detailsCaption": "Details",   "contactsCaption": "Teachers",................................

为了使日历库加载这个文件,我们需要在 页中包含它。这可以通过引用来完成。<script src=”./Localization/en1.js” type=”text/javascript”></script>

在你定义了Calendar对象的JavaScript代码中,你必须将locale对象分配给在本地化文件夹中的en.js文件中定义的 enlocale对象。

calendar.locale = enlocale;

2. 使用JSON本地化文件

 const xhr = new XMLHttpRequest(),    method = "GET";var fileName = "./Localization/en.json"xhr.open(method, fileName, true);xhr.onreadystatechange = function () {  // In local files, status is 0 upon success in Mozilla Firefox  if(xhr.readyState === XMLHttpRequest.DONE) {    var status = xhr.status;    if (status === 0 || (status >= 200 && status < 400)) {      // The request has been completed successfully      console.log(xhr.responseText);  var result = JSON.parse(xhr.responseText);  calendar.locale = JSON.parse(xhr.responseText);    } else {      // Oh no! There has been an error with the request!    }  }};xhr.send();

当你重新加载项目时,你应该能够看到与JavaScript文件完全相同的结果。

MindFusion除此之外JavaScript图标库提供了很多商业图表、仪表盘等,是一套比较完备的组件。

点击这里下载MindFusion Javascript Chart

标签:

声明:本站部分文章及图片源自用户投稿,如本站任何资料有侵权请您尽早请联系jinwei@zod.com.cn进行处理,非常感谢!

上一篇 2021年8月24日
下一篇 2021年8月24日

相关推荐

发表回复

登录后才能评论