在jsp页面嵌套的Iframe中使用kindEditor.(jsp结合使用LigerUi-1.2.2)
初次使用kindEditor(在线HTML编辑器),kindEditor官网:http://www.kindsoft.net/index.php
product.jsp中HTML:
<div id="kindEditorDialog" style="display: none; height: 380px;">
<iframe id="editIframe" style="height: 379px;"></iframe>
</div>
product.jsp中javascript:
var kindEditorDialog = null;
//主页面选择一条记录进行详情描述,打开kindEditor页面:
function f_detailDialog(){
var select = mainGrid.getSelected();
if(!select){
LG.tip("请选择一条记录");
return;
}
f_detail_dialog(null,$("#kindEditorDialog"));
$('#editIframe').attr('src', '${ctx}/kindeditor/editor');//动态配置路径,调用controller类中跳转kindEditor.jsp页面
}
//初始化详情描述编辑dialog:
function f_detail_dialog($form,$dialog){
kindEditorDialog = $.ligerDialog.open({
target : $dialog,
width : 1024,
top : 20,
title : '详情描述',
buttons : [ {
text : '确定',
onclick : function() {
f_save_detail(kindEditorDialog,$form,kindEditorForm);
}
},{
text : '取消',
onclick : function() {
kindEditorDialog.close();
}
} ]
});
}
//发送ajax同步请求,获取初始化编辑器textarea内容
function f_getText() {
var detail = null;
var select = mainGrid.getSelected();
$.ajax({
url: '${ctx}/portal/product/selByProductId/' + select.productId,
type: "POST",
dataType: "json",
async: false
}).done(function(product) {
detail = product.deatil;
});
return detail;
}
//product.jsp页面获取kindEditor信息,并保存
function f_save_detail(dialog,$form,form) {
var iframe = $("#editIframe")[0].contentWindow || $("#editIframe")[0].window;
var detail = iframe.editor.html();
var param = {};
param.detail = detail;
param.productId = mainGrid.getSelected().productId;
$.post('${ctx}/portal/product/saveDetail',param,function(msg){
if(msg){
LG.tip("保存成功.");
}else{
LG.tip("保存失败.");
}
kindEditorDialog.close();
});
}
kindEditor.jsp中HTML:
<textarea name="deatil" cols="100" rows="10" id="editor_id"
style="width: 1000; height: 200; visibility: hidden;">
</textarea>
kindEditor.jsp中javaScript:
var editor = null;
KindEditor.ready(function(K) {
editor = K.create('textarea[name="deatil"]', {
width : '986px',
height : '370px',
langType : 'en',
desinModel : false,
filterMode : true,//true时根据 htmlTags 过滤HTML代码,false时允许输入任何代码
uploadJson : '${ctx}/kindeditor/uploadJson',//指定上传文件的服务器端程序
fileManagerJson : '${ctx}/kindeditor/fileManagerJson',//指定浏览远程图片的服务器端程序
allowFileManager : true,
fullscreenMode : false,
afterCreate : function() {//初始化编辑器结束事件
var f_getText = window.parent.f_getText;//获取父页面是否有f_getText方法
if (f_getText) {
editor.html(f_getText());//有f_getText方法,则执行f_getText方法
}
}
});
});