easyui整合kindeditor的一些问题

问题描述

使用easyui执行post后不会提交kindeditor对应的textarea中新增的内容。只会显示默认内容。

具体代码

HTML代码

 
 
<form id="page" method="post" novalidate>
<div style="margin-bottom:20px">
<div>单页标题:</div>
<input name="title" class="easyui-textbox" style="width:600px;height:32px" missingMessage="单页标题不能为空" data-options="required:true">
</div>
<div style="margin-bottom:20px">
<div>单页别名(<span style="color:red">请勿使用中文和特殊符号.模板名一定要和别名相同</span>):</div>
<input class="easyui-textbox" name="name" style="width:300px;height:32px" missingMessage="单页别名不能为空" data-options="required:true">
</div>
<div style="margin-bottom:20px">
<div>单页关键词(<span style="color:red">多个关键词请用,号隔开</span>):</div>
<input class="easyui-textbox" name="keywords" style="width:600px;height:32px">
</div>
<div style="margin-bottom:20px">
<div>单页描述信息:</div>
<input class="easyui-textbox" name="description" data-options="multiline:true" style="width:600px;height:60px"></input>
</div>
<div style="margin-bottom:20px">
<div>单页内容:</div>
<textarea id="kindeditor" class="easyui-kindeditor" name="content" style="width:100%;height:500px;">111111111</textarea>
</div>
</form>

JAVASCRIPT代码

 
 
<script type="text/javascript">
var url = '{:U(\'Page/addPage\')}';
 
function addPage(){
$('#page').form('submit',{
url: url,
onSubmit: function(){
return $(this).form('validate');
},
success: function(result){
var result = eval('('+result+')');
if (result.errorMsg){
$.messager.show({
title: '添加失败',
msg: result.errorMsg
});
} else {
$.messager.show({
title: '添加成功',
msg: result.successMsg
});
}
}
});
}
</script>

提交后

可以看到，提交后的值还是textarea的默认值。原因就是没有给kindeditor添加afterChange事件。解决方法就是添加以下代码

 
 
var editor;
KindEditor.ready(function(K) {
 editor = K.create('#kindeditor', {
       afterChange: function () {
          this.sync();
        },
      afterBlur: function () { this.sync(); }
 
 });
 

然后重新post，即可看到textarea的值已经更新了…

 

转载请注明：安全者 » easyui整合kindeditor的一些问题