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. AP创建会计科目

    一. 创建会计科目的途径 1. 在发票工作台对单张发票进行创建科目: 2. 提交“创建会计科目”并发请求,对所有已经验证但尚未创建会计科目的发票进行创建会计科目. 二. 对单张发票创建会计科目 发票在 ...

  2. Hello mybatis

    idea玩mybatis,终于搞出个hello mybatis.记录下过程,备忘. 1.person表 CREATE TABLE `person` ( `id` ) NOT NULL AUTO_INC ...

  3. 错误C4146的解决方法

    error C4146: 一元负运算符应用于无符号类型,结果仍为无符号类型: 那么什么情况下会遇见这种错误呢,例如下代码: 错误代码1:int number = -2147483648; //erro ...

  4. Exynos 4412 Uboot源码解析

    原文地址:http://www.cnblogs.com/jacklu/p/6226330.html Exynos 4412 Uboot的汇编代码就不贴了,没有的可以私信我. 这是我当时阅读代码时的思维 ...

  5. MVC过滤器详解

    MVC过滤器详解   APS.NET MVC中(以下简称"MVC")的每一个请求,都会分配给相应的控制器和对应的行为方法去处理,而在这些处理的前前后后如果想再加一些额外的逻辑处理. ...

  6. HDOJ(1348)二维凸包

    Wall http://acm.hdu.edu.cn/showproblem.php?pid=1348 题目描述:有个国王想在他的城堡外面修围墙,围墙与城堡的最小距离为L,要求围墙长度最短.求围墙的长 ...

  7. Hibernate和Struts2整合的增、删、改、查

    1. 新建一个Web项目,准备好jar包和配置文件. 2. web.xml文件中添加过滤器 <?xml version="1.0" encoding="UTF-8& ...

  8. zTree入门-最简单的树

    最近发现项目中很多地方都是树形菜单,而这些树形菜单都是使用树形插件zTree来制作的,所以就想自学一下zTree,参照官方文档写了一个简单的案例,使用zTree做了 一个最简单的树形结构. 案例:zT ...

  9. node中global

    global:表示Node所在的全局环境,类似于浏览器的window对象.需要注意的是,如果在浏览器中声明一个全局变量,实际上是声明了一个全局对象的属性,比如var x = 1等同于设置window. ...

  10. mysql 存储过程 游标 判断游标是否为空

    BEGIN DECLARE id long; DECLARE Done INT DEFAULT 0; DECLARE cashamount DECIMAL(10,2) DEFAULT 0.00; DE ...