EditArea是一个支持语法高亮的文本编辑器,同类软件还有Ace, CodeMirror等。具体功能方面的差异,请访问http://en.wikipedia.org/wiki/Comparison_of_JavaScript-based_source_code_editors

项目中用到ExtJS 4.2和EditArea,由于找不到EditArea插件,因此自己实现了一个,经测试基本可用。实现过程仿照已有插件,比较简单,不再啰嗦。

Ext.define('Ext.ux.form.EditTextArea', {
extend: 'Ext.form.TextArea',
alias: 'widget.editarea', initComponent: function() {
var me = this;
this.eaid = this.id;
me.callParent(arguments);
editAreaLoader.init({
id: this.eaid,
start_highlight: this.initialConfig.start_highlight || true,
language: this.initialConfig.language|| 'en',
syntax: this.initialConfig.syntax,
syntax_selection_allow: "css,html,js,php,python,vb,xml,c,cpp,sql,basic,pas,brain",
allow_toggle: this.initialConfig.allow_toggle || true,
allow_resize: this.initialConfig.allow_resize || false,
replace_tab_by_spaces: this.initialConfig.replace_tab_by_spaces || 4,
toolbar: this.initialConfig.toolbar || "search, go_to_line, |, undo, redo, |, select_font,|, change_smooth_selection, highlight, reset_highlight, |, help",
is_editable: this.initialConfig.is_editable || true,
show_line_colors: true,
//plugins: "autocomplite",
autocompletion:true
});
}, afterRender: function() {
this.callParent();
}, getValue:function(){
var v = editAreaLoader.getValue(this.eaid);
return v;
}, setValue: function(value) {
editAreaLoader.setValue(this.eaid, value);
},
onDestroy: function() {
editAreaLoader.delete_instance(this.eaid);
this.callParent();
}
});

ExtJS4插件EditArea的更多相关文章

  1. myeclipse/eclipse添加Spket插件实现ExtJs4.2/ExtJs3智能提示

    前言 感谢luotao,本博客是copy这篇博客的:http://www.cnblogs.com/luotaoyeah/p/3803926.html ,因为太重要了,所以笔者再写一次. 重要说明:ec ...

  2. ExtJS4.2学习(14)基于表格的扩展插件(2)(转)

    鸣谢:http://www.shuyangyang.com.cn/jishuliangongfang/qianduanjishu/2013-11-26/184.html --------------- ...

  3. 转载:Eclipse+Spket插件+ExtJs4修改版提供代码提示功能[图]

    转载:Eclipse+Spket插件+ExtJs4修改版提供代码提示功能[图] ExtJs是一种主要用于创建前端用户界面,是一个基本与后台技术无关的前端ajax框架.功能丰富,无人能出其右.无论是界面 ...

  4. EXTJS4 Grid Filter 插件的使用 与后台数据解析------Extjs 查询筛选功能的实现

    先汗一个,一个小功能又踢腾了一天.本来这个带Demo的,但是上面介绍的不是很详细.用的时候问题不大,主要问题在文件导入方面.以为这个插件的使用和其他的不一样. 1.首先是需要引入文件的位置:如图 需要 ...

  5. ExtJS4.2学习(13)基于表格的扩展插件---rowEditing

    鸣谢:http://www.shuyangyang.com.cn/jishuliangongfang/qianduanjishu/2013-11-24/182.html --------------- ...

  6. ExtJs4之TreePanel

    Tree介绍 树形结构,是程序开发,不可缺少的组件之一.ExtJs中的树,功能强大美观实用.功能齐全,拖拉,排序,异步加载等等. 在ExtJs4中Tree和Grid具有相同的父类,因此Grid具有的特 ...

  7. 【chrome插件】web版微信接入图灵机器人API实现自动回复

    小贱鸡自动回复API已经不可以用了,现在改良接入图灵机器人API 360chrome浏览器团队翻译了部分谷歌插件开发文档 地址:http://open.chrome.360.cn/extension_ ...

  8. extjs4 各种怪异问题

    用extjs4 已经有一段时间了,过去开发的时候用过extjs2.2 因为放下了两年所有很多东西记得不是很清楚了,现在又直接使用4 突然发现这个世界变得太快连代码都变得这么快,大部分东西都完全不一样了 ...

  9. ExtJs4中的复选树级联选择

    好久没有写新的博文了,过了个年休息了近一个月,人都懒散了.. 这几天要把项目中的几个模块有ext3升级到ext4,还要保持页面展示和功能要跟3.x版本的一样.升级并不是一件简单的是,基本相当于重写了, ...

随机推荐

  1. 读《JavaScript DOM编程艺术》

    国庆假期花了三四天看了这本书,书很薄,因为是入门书,干货也不是很多. 4. childNodes nodeType nodeValue firstChild lastChild childNodes返 ...

  2. 关于SQL预编译问题。

    标准都是sql.add('insert a (b,c,d)values(:a,:b,:c)');params.parambyname('a').asstring:='';...

  3. PHP存储blob示例(转)

    原文:http://www.mysqltutorial.org/php-mysql-blob/ <?php /* CREATE TABLE files ( id INT AUTO_INCREME ...

  4. ---Java 678

    sudo add-apt-repository ppa:webupd8team/java sudo apt-get update udo apt-key adv --recv-key --keyser ...

  5. 带隙基准(Bandgap,BG)

    Bandgap voltage reference,常常有人简单地称它为Bandgap.最经典的带隙基准是利用一个与温度成正比的电压与一个与温度成反比的电压之和,二者温度系数相互抵消,实现与温度无关的 ...

  6. 图像上传OSS的BUG

    今天遇到了一个流上传BUG. 图像经过压缩后传到阿里OSS上后无法显示,下载后发现图像大小为0KB. 调试发现上传的时候发现处理后的流大小正确. 最后发现是流经过图像处理后没有复位. 使用res.Se ...

  7. 走进异步编程的世界 - 开始接触 async/await

    [C#] 走进异步编程的世界 - 开始接触 async/await   走进异步编程的世界 - 开始接触 async/await 序 这是学习异步编程的入门篇. 涉及 C# 5.0 引入的 async ...

  8. 转载:Solr的自动完成实现方式(第三部分:Suggester方式续)

    转自:http://www.cnblogs.com/ibook360/archive/2011/11/30/2269126.html 在之前的两个部分(part1.part2)中,我们学会了如何配置和 ...

  9. 8086cpu-intel汇编指令简介

    jcxz   有条件跳转指令,cx为跳转条件.如果(cx)==0则跳转到指定标号处.跳转地址在机器码中已相对位置(-128~127)给出. 相当于                if((cx)==0) ...

  10. Git使用心得

    1.git是分布式的版本控制(有本地仓库)git 先对安全 2.git基于元数据   svn是基于目录的 3.本地的提交分为三个步骤(提交本地仓库先提交暂存区再提交本地仓库) 工作区         ...