翻譯|使用教程|編輯:何躍|2021-09-27 14:21:56.073|閱讀 214 次
概述:在這篇博文中,我們將向你展示如何在MindFusion Scheduler for JavaScript中定制表格上出現的標題。你可以使用同樣的技術來改變日歷的用戶界面上出現的任何字符串或格式。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
在這篇博文中,我們將向你展示如何在MindFusion Scheduler for JavaScript中定制表格上出現的標題。你可以使用同樣的技術來改變日歷的用戶界面上出現的任何字符串或格式。我們將通過本地化文件做到這一點。下面是最終應用程序的截圖。
當你下載試用版的JavaScript scheduler或JavaScript包時,你會看到一個名為 "本地化 "的文件夾。那里有JSON和JS文件,代表日歷用戶界面的標題和格式化字符串。它們都可以用來定制日歷。
I. 使用 JavaScript 本地化文件
JavaScript本地化文件定義了一個對象,它代表本地化信息。你應該在其中編輯你想要改變的字符串。下面是我們如何編輯英語本地化文件的,它被稱為en.js(中文對應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", ................................為了使日歷庫加載這個文件,我們需要在網頁中包含它。這可以通過引用來完成。<script src="./Localization/en1.js" type="text/javascript"></script>
在你定義了Calendar對象的JavaScript代碼中,你必須將locale對象分配給在本地化文件夾中的en.js文件中定義的 enlocale對象。
calendar.locale = enlocale;2. 使用JSON本地化文件
改變文字展示的另一個選擇是編輯本地化文件夾中的一個*.json文件。在這種情況下,你必須加載該文件,解析JSON字符串并將其分配給locale屬性。
en.json文件和en.js文件是一樣的,區別在于對 enlocale對象的定義:JSON文件沒有定義任何對象,只有數據。
我們在json文件中就標題字符串做同樣的修改。我們輸入 "新班級"、"教師 "和 "房間",而不是默認的字符串。由于這是一個JSON文件,我們需要從服務器上加載它。我們使用XMLHttpRequest來做到這一點。
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
本站文章除注明轉載外,均為本站原創或翻譯。歡迎任何形式的轉載,但請務必注明出處、不得修改原文相關鏈接,如果存在內容上的異議請郵件反饋至chenjj@fc6vip.cn