`

extjs4与FCKeditor整合

 
阅读更多
   EXTJS4与FCKeditor整合:
  1.自定义CKeditor控件,继承自textArea

Ext.define('Ext.ux.form.CkEditor', {

    extend: 'Ext.form.field.TextArea',

    alias: 'widget.ckeditor',

    onRender : function(ct, position){
        if(!this.el){
            this.defaultAutoCreate = {
                tag: "textarea",
                autocomplete: "off"
            };
        }
        this.callParent(arguments);
        this.editor = CKEDITOR.replace(this.inputEl.id, this.CKConfig);
    },

    setValue: function(value) {
        if(this.editor){
            this.editor.setData(value);
        }
        this.callParent(arguments);
    },

    getValue: function() {
        if (this.editor) {
            this.editor.updateElement();
            return this.editor.getData();
        } else {
            return '';
        }
    },

    getRawValue: function() {
        if (this.editor) {
            this.editor.updateElement();
            return this.editor.getData();
        } else {
            return '';
        }
    }
});


2,像其他控件一样使用
var items = [
            hiddenId,
            {
                xtype:'textfield',
                name:'title',
                layout:'form',
                fieldLabel:'title',
                labelWidth:50,
                columnWidth:.2,
                labelAlign:'right'
            },
            {
                xtype: 'ckeditor',
                fieldLabel: 'content',
                labelAlign: 'left',
                name: 'content',
                allowBlank: true,
                CKConfig: {
                    height: '300',
                    //如果选择字体样式等的弹出窗口被当前window挡住,就设置这个为一个较大的值
                    baseFloatZIndex: 99999,
                    //图片和flash都上传到这里
                    filebrowserUploadUrl: '/upload'
                }
            }
        ];

3,取值和以前一样取法,request.getPrameter("content");
   设置值也和其他的一样,
        this.down('ckeditor').setValue(jsonObj.content);
分享到:
评论

相关推荐

    FCKeditor结合extjs实例

    最近给公司做网站,采用滴sturt2 extjs fckeditor完成滴,由于是和一个同事一起完成滴所有我做了4个模块,但是技术基本都用了,

    extjs + fckeditor 的结合源码

    extjs + fckeditor 的结合源码 这个demo讲的是extjs + fckeditor 的结合 测试环境vs2008+xp+extjs2.2+fckeditor 2.x 大家运行Default.aspx就可以看到效果了

    extjs多版本整合应用

    多版本整合ExtJs应用多版本整合ExtJs应用多版本整合ExtJs应用多版本整合ExtJs应用多版本整合ExtJs应用多版本整合ExtJs应用多版本整合ExtJs应用多版本整合ExtJs应用多版本整合ExtJs应用多版本整合ExtJs应用。

    extjs_dwr整合例子

    自己写的extjs和dwr整合,自己写的extjs和dwr整合

    extjs + fckeditor 的结合asp.net版

    本人agd第一次发demo比较粗糙...这个demo讲的是extjs + fckeditor 的结合 这个demo网上有 但是是java版的 今天我把它转换成asp.net版 测试环境vs2008+xp+extjs2.2+fckeditor 2.x 大家运行Default.aspx就可以看到效果了

    ssh+extjs4整合开发

    该demo为Spring2.0+struts2.0+hibernate3 +extjs4.0整合开发得demo。希望对想了解extjs4的同学有帮助!没资源分了挣点资源分!

    extjs与struts的整合代码

    extjs与struts的整合代码,一个Ext与struts整合的代码,包括传统的实现方式,对比学习,很快就能了解其优势

    Extjs4的demo

    Extjs4的demo 很不错的例子

    EXTJS4自学手册

    EXTJS4自学手册——EXT文件目录,本地加载文档,命名规范 EXTJS4自学手册——EXT基本方法、属性(onReady、define、create) EXTJS4自学手册——EXT基本方法、属性(apply、applyIf、constructor) EXTJS4自学手册...

    extjs6与webuploader整合示例展现到grid列表

    swfupload.js与extjs整合由于与浏览器兼容性不好,后改为webuploader,图片上传示例,加入到grid列表,显示相关的状态信息,例子简单修改一下即可使用,extj所有版本都类似。注:IE中测试需要部署在服务器下,上传...

    包含各种类型的extjs小图标,Extjs4小图标

    包含各种类型的extjs小图标,Extjs4小图标

    extJs3升级extjs4方案

    extJs3升级extjs4方案, extJs3升级extjs4需要修改大量代码

    Django1.6与extjs4整合

    NULL 博文链接:https://cywhoyi.iteye.com/blog/1993084

    extJS4升级至extJS6.6所遇问题及解决方案

    项目进行前端框架升级——extJS 4升级至extJS6.6所遇的一些问题及相对应的解决方案建议

    Extjs4添加tooltip

    Extjs4的textfield控件竟然没有tooltip悬浮提示,这应该算是个bug吧。网上查了很多,也没有方案。后来自己通过查询并整理出这个方案,终于实现了。 思想如下: 在textfield渲染时注册mouseover事件,然后在其中调用...

    Extjs结合fckeditor+c#实现新闻发布

    网上下了个fckedtor在extjs中引用的例子,但是根本无法运行,经一番修改可以真正运行了,运行环境为vs2010

    EXT JS ExtJS 4

    我很自豪能代表Sencha和ExtJS团队和大家成功的分享了ExtJS 4的预览版、3个beta版和今天发布的正式版等5个版本。 ExtJS 4从创建之初,就以最全面现代化为目标,它采用了改进的架构和加入了许多新的特性,从而使你可以...

    人人都玩开心网 ExtJS Android.SSH整合开发Web与移动SNS.(李宁)

    人人都玩开心网 ExtJS Android.SSH整合开发Web与移动SNS.(李宁)

    extjs4 中文 API

    extjs4 中文 API

Global site tag (gtag.js) - Google Analytics