论坛首页 Web前端技术论坛

Ext中使用FCK

浏览 2880 次
锁定老帖子 主题:Ext中使用FCK
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2009-04-06   最后修改:2009-04-11

      Ext自己带了一个Html编辑器,但是这个编辑器中的功能有限,自己也给这个编辑器做了一下扩展,但是由于Ext自身的原因,始终存在一些小问题,所以在Ext中使用FCK编辑器也是一个不错的选择,结合自己的实践在这里总结一下Ext中使用FCK编辑器的方法,请高手们提提意见!

     首先在页面的前面导入js文件,这个就不用说了!

<script type="text/javascript" src="/resource/fckeditor.js"></script>

 然后用Ext代码建立一个FormPanel,这里就不写出全部代码,仅仅贴出需要加载FCK编辑器的地方,代码如下:

{
xtype:"textarea",
name:"content",
value:"",
width:720,
height:600,
fieldLabel:"新闻内容",
listeners:{
	 render":function(f){
	                   fckEditor = new FCKeditor("content") ;//初始化FCK
	                   fckEditor.Height=600;//设置FCK编辑器的高度
	                   fckEditor.Width=720;//设置FCK编辑器的宽度
	                   fckEditor.BasePath = "/resource/" ;//设定FCK的源文件路径,这里要注意相对和绝对路径
	                   fckEditor.ReplaceTextarea() ;//用FCK编辑器替换Ext中的textarea
	                 }
                   }	
}

 Ext的控件可以添加listeners,在listeners中渲染出一个FCK编辑器,个人认为这是最简单的也是最方便的方法,如上的代码,仅仅几行就给FCK编辑器添加到Ext中去了,使得EXT和FCK得到完美的结合!

   发表时间:2009-04-07  
var fck = new FCKeditor('demo');

var form = new Ext.form.FormPanel({
xtype: 'form',
items:[{
hideLabel: true,
html: fck.CreateHtml()
}]
});
0 请登录后投票
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics