在這篇博文中，我們將向你展示如何在MindFusion Scheduler for JavaScript中定制表格上出現(xiàn)的標(biāo)題。你可以使用同樣的技術(shù)來(lái)改變?nèi)諝v的用戶界面上出現(xiàn)的任何字符串或格式。我們將通過(guò)本地化文件做到這一點(diǎn)。下面是最終應(yīng)用程序的截圖。

當(dāng)你下載試用版的JavaScript scheduler或JavaScript包時(shí)，你會(huì)看到一個(gè)名為 "本地化 "的文件夾。那里有JSON和JS文件，代表日歷用戶界面的標(biāo)題和格式化字符串。它們都可以用來(lái)定制日歷。

I. 使用 JavaScript 本地化文件

JavaScript本地化文件定義了一個(gè)對(duì)象，它代表本地化信息。你應(yīng)該在其中編輯你想要改變的字符串。下面是我們?nèi)绾尉庉?英語(yǔ)本地化文件的，它被稱為en.js（中文對(duì)應(yīng)zh.js）。

"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",
................................

在你定義了Calendar對(duì)象的JavaScript代碼中，你必須將locale對(duì)象分配給在本地化文件夾中的en.js文件中定義的 enlocale對(duì)象。

calendar.locale = enlocale;

改變文字展示的另一個(gè)選擇是編輯本地化文件夾中的一個(gè)*.json文件。在這種情況下，你必須加載該文件，解析JSON字符串并將其分配給locale屬性。
en.json文件和en.js文件是一樣的，區(qū)別在于對(duì) enlocale對(duì)象的定義：JSON文件沒有定義任何對(duì)象，只有數(shù)據(jù)。
我們?cè)趈son文件中就標(biāo)題字符串做同樣的修改。我們輸入 "新班級(jí)"、"教師 "和 "房間"，而不是默認(rèn)的字符串。由于這是一個(gè)JSON文件，我們需要從服務(wù)器上加載它。我們使用XMLHttpRequest來(lái)做到這一點(diǎn)。

 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();

MindFusion除此之外JavaScript圖標(biāo)庫(kù)提供了很多商業(yè)圖表、儀表盤等，是一套比較完備的組件。

點(diǎn)擊這里下載MindFusion Javascript Chart