如何在 Aras 窗体中实现富文本编辑器

如果有文档编辑的需求,需要调整文本的内容,需要图片以及超链接,就需要富文本编辑器,在Aras中如何实现富文本编辑器

效果图:

场景:属性中Text类型的文本,就可能会用到富文本编辑器

首先,新建一个Form,在Form中新建一个Text Area控件

在窗体OnPopulatedForm事件,添加JS方法,

加入如下代码:

initDojoEditor();

function initDojoEditor() {
if (typeof(dojo) == "undefined")
{
setTimeout(initDojoEditor, 100);
return;
}

var version = top.aras.commonProperties.clientRevision.split('.')[0];
var build = top.aras.commonProperties.clientRevision.split('.')[3];

dojo.registerModulePath("Aras", "../Aras");
dojo.require("Aras.Client.Controls.Public.HtmlEditor");

dojo.require("dijit.layout.BorderContainer");
//Add images urls dictionary
var urlsDic = { vaultUrls: [], tempUrls: [], Count: 0 };

var searchbar;

dojo.ready(function () {
// Create HtmlEditor
//add claro class into body node to correctly display the pop-up dialog in HtmlEditor
if(!dojo.hasClass(dojo.body(), "claro")) {
dojo.addClass(dojo.body(), "claro");
}
var req_rm_text = null;
var req_rm_textNodes = dojo.query("textarea.req_rm_text.dijitEditor");
if (req_rm_textNodes && req_rm_textNodes.length == 1) {
req_rm_text = req_rm_textNodes[0];
if (req_rm_text) {
var dijitEditor = dijit.byId(req_rm_text.id);
if (dijitEditor) {
dijitEditor.set('disabled', !(document.isEditMode));
}
}
}
else {
req_rm_textNodes = dojo.query("textarea.req_rm_text");
if(req_rm_textNodes && req_rm_textNodes.length == 1)
{
req_rm_text = req_rm_textNodes[0];
if(req_rm_text) {
//fix "IR-020577 DOJO: incorrect scroll position in HTML Editor"
dojo.setStyle(req_rm_text.parentNode, "width", dojo.marginBox(req_rm_text).w + "px");
dojo.setStyle(req_rm_text.parentNode, "display", "block");
dojo.setStyle(req_rm_text.parentNode, "whiteSpace", "normal");
//------
window.htmlEditor = new Aras.Client.Controls.Public.HtmlEditor({
id: req_rm_text.id,
arasObj: top.aras,
initHandler: initEditor,
disabled: !(document.isEditMode),
copyHandler: function (editor) {
top.aras.utils.setClipboardData("Text", editor._getSelectedHtml());
},
cutHandler: function (editor) {
top.aras.utils.setClipboardData("Text", editor._cutSelectedHtml());
},
pasteHandler: function (editor, data) {
editor.execCommand("inserthtmlex", data || top.aras.utils.getClipboardData());
}
});

dojo.connect(window.htmlEditor, "onBlur", onBlurDojoEditor);
dojo.connect(window.htmlEditor, "onChange", onChangeDojoEditor);
}
}
}
});
function initEditor() {
//var sNewHtml = "";
//htmlEditor.setHTMLSource(false, sNewHtml);
}
}

function fireHtmlEvent(htmlElement, eventName) {
var evt = null;
if (document.createEventObject)
{
evt = document.createEventObject();
htmlElement.fireEvent("on"+eventName, evt);
}
else if (document.createEvent)
{
evt = document.createEvent("HTMLEvents");
evt.initEvent(eventName, false, false);
htmlElement.dispatchEvent(evt);
}
}
function onBlurDojoEditor() {
var req_rm_textNodes = dojo.query("textarea.req_rm_text");
if(req_rm_textNodes && req_rm_textNodes.length==1)
{
var req_rm_text = req_rm_textNodes[0];
req_rm_text.value = this.getHTMLSource(false);
if(req_rm_text.onblur){fireHtmlEvent(req_rm_text,"blur");}
}
}
function onChangeDojoEditor(newContent){
var req_rm_textNodes = dojo.query("textarea.req_rm_text");
if(req_rm_textNodes && req_rm_textNodes.length==1)
{
var req_rm_text = req_rm_textNodes[0];
// We should ignore newContent because it's plain text but we need HTML
req_rm_text.value = this.getHTMLSource(false);
if(req_rm_text.onchange){fireHtmlEvent(req_rm_text,"change");}
}
}

 

打赏
分享到QQ 分享到微信 分享到微博

0 条评论

发表我的观点

取消

切换注册

登录

忘记密码 ?

您也可以使用第三方帐号快捷登录

Q Q 登 录
微 博 登 录
切换登录

注册