不知何时网络上开始流行在ExtJS里用下拉树来选择东东,似乎是个很有创意的事情,让人看得心痒痒的,只好动手去“偷”啦。 使劲Google了一番,找到很多例子,有扩展Ext.form.ComboBox的也有通过重写Ext.form.ComboBox.onTriggerClick方法来实现的,总之是八仙过海各显神通了。
但是,似乎或多或少的,我见到的实现都有一些的问题,有的在下拉树展开之后,必须要点击里面的节点才能够collapse收起,在该输入框失去焦点的时候不能自动收起,有的,在控制高度的时候又有问题,只能够制定一个高度,不能自适应高度的。 当然,可能存在更多完美的实现,只是到目前为止,我还没有发现,所以只好自己动手。
首先是在要不要扩展Ext.form.ComboBox上挣扎了一小段时间,最后毅然选择了扩展。理由很简单,扩展后的TreeComboBox可以重用啊,这个多好啊,咱就好这口,就喜欢拿来主义,看见好的实现,直接拿来用就成,比如上一篇里有提到的FCKeditor,不也是一个扩展的吗? 如果是重写onTriggerClick方法,看似代码简单,实则每个需要用到下拉树的地方都要去写一遍,反而麻烦,并且也打算了代码的结构,似乎有点得不偿失的感觉。
再说网络上很多扩展了Ext.form.ComboBox,却又把tree给render到document.body或者是重写ComboBox的tpl的做法,都是不怎么完美的方法,需要额外覆盖ComboBox的其他几个方法(具体是哪几个,忘了,因为自己当时这么做的时候有试验过但是没有笔记……:sad: ),主要问题是这样的实现,会导致不能够在失去焦点的时候自动收起树,即是说不能触发“collapse”事件,还有偶尔会出现树第一次打开没问题,再次打开时却一片空白的现象。
另外,如果是设定最小高度,然后再自动高度的话,最好是可以把shadow阴影给去掉,不然,呵呵…… 试试就知道有多丑了。
最后,ComboBox本身要维护一个list,最好的实现方法就是将我们的tree当成这个list来维护。
下面讲讲我最后得出来的方案,暂时只支持了ComboBox和TreePanel的几个基本属性(够用就好,有需要的自己添加去),用法和Ext.ux.form.FCKeditor类似,我是把TreeComboBox注册成了“treecombo”,有需要的请自由发挥吧。 另外,我新添加了一个autoCollapse属性,接受布尔值,用来设定是否在collapse ComboBox的时候,自动执行tree.collapseAll()方法。使用下拉树,我们通常目的是显示的是一个值,另外再保存一个对应的“id”之类的隐藏值。获取textfield里看到的值用getRawValue()方法,获取隐藏值用getValue()方法, 赋值的方式一样分别是setRawValue()和setValue(),要注意的是,如果用FormPanel.getForm().loadRecord(record)的方法的话,需要手动执行一个setRawValue()来设定textfield的值哦。
以下是一个可能的调用方法:
Read more…
JavaScript, Programming, Tool, Web ComboBox, ExtJS, TreeComboBox
在说完NTKO之后,再说说网络上大行其道的FCKeditor在ExtJS中的整合问题,网络上流传最广的方式莫过于扩展Ext.form.TextArea了。
鄙人在此也提供一个解决的方案,同样是扩展Ext.form.TextArea来的,原型是哪位同学创造出来的已经不得而知了,因为,经过我们伟大同学们数以千万次的复制粘贴,“原作者”早就不知道换过多少届了。 也罢也罢,我也复制粘贴了一回,不过至少我还是根据自己需要稍有调整,并保证我贴上来的代码是经过自己反复使用过的,确信能够调试通过的吧:smile:
:smile:
先说用法,和其他form表单元素一样的,只是把type指定成fckeditor就可以了,当然,如果你愿意的话,也可以把代码尾部的一行
Ext.reg(’fckeditor’, Ext.ux.form.FCKeditor);
里面的fckeditor修改成其他的,从而发明出新的编辑器嘛,哈哈:shock:
:shock:
Read more…
JavaScript, Programming, Tool, Web ExtJS, FCKeditor, 扩展
做办公自动化系统(OA),总免不了和Office文档打交道,呵呵,其实,这只是因为政府的人都只会用MS Office:cry:
能够实现在网页中嵌入Office文档的ActiveX控件有很多,这次公司选用的是NTKO的产品,至于为什么是NTKO,这不是本篇文章的重点,确切说我对此没有任何兴趣。
NTKO提供了比较详尽的开发文档,里面对各个接口都很非常详细的介绍,如果还不能满足你的需要,可以查MSDN。
至于我为什么要劳神地去写这么一个NtkoAdapter.js,理由很简单,可能是做Java的时间长了,什么都想OO一下。
如果没有OO,要使用NTKO的Office,和页面进行交互的话是个很繁琐的事情,要取到object对象,再直接操纵它,例如要设置文档标题则是用:ntko.Caption =’标题’,的方式,这样的事情对Javaer来说,不知道算不算是个nightmare呢? 要是能有个 ntko.setCaption(’标题’) 的方法,该有多好啊:lol:
:lol:
再者,OA系统每实施一个单位,都需要重复购买一套NTKO,那么授权信息都会随之而改变,而在一套OA系统里,不会说只有一个地方用到这个NTKO吧? 要修改起来是不是麻烦得很呢?
NtkoAdapter由此而生,顾名思义,呵呵,Java的就是要顾名思义嘛,NtkoAdapter,首先是一个Adapter哈,提供一个NtkoAdapter的JS类,将一些基础参数封装到构造函数中,而构造函数的所有参数都借助于JavaScript原生支持的JSON来搞掂,哈哈,这是最近ExtJS的后遗症……
有了NtkoAdapter,外出实施OA系统的时候,只要修改一下NtkoAdapter里关于授权信息的定义即可,不用到处去改啦。 要调用Ntko也很简单,直接
var ntko = new NtkoAdapter({
renderTo:’content’,
id:’content’,
titlebar:false, // 不显示标题栏
menubar:false, // 不显示菜单栏
autoCreate:’doc’ // 自动创建一个Word文档
});
Read more…
JavaScript, Programming, Web Adapter, NTKO, OA, Web Office
最近公司的一个信息报送项目里,用到ExtJS+Spring+Hibernate的架构,还用到了NTKO的Office控件,需要将Office控件编辑好的.doc或是.xls等office文档上传到服务器的数据库里,因此学习了一下Spring+hibernate架构下的上传文件的方法,期间遇上了“java.lang.IllegalStateException: Active Spring transaction synchronization or active JTA transaction with specified [javax.transaction.TransactionManager] required”这个异常,Google了很久,参考了很多的资料,走了很多的弯路,最后无心插柳柳成荫,居然自己解决了,而且似乎和网上普遍流传的方法稍微有一点点不一样。
hibernate支持多种上传组件,本文使用的是commons-fileupload.jar。
先看POJO,只贴和blob相关的部分代码:
@Entity
class Article{
@Lob
@Basic(fetch = FetchType.LAZY)
@Column(columnDefinition = "BLOB")
//@Type(type = "org.springframework.orm.hibernate3.support.BlobByteArrayType")
private byte[] content;
}
这就是我和很多朋友不同的地方之一,网上流传的大部分人都是用的xml的配置文件,而我是用的Annotations,方便啊,如果有变动,直接在类文件里改改就好啦,不用再去翻xml文件,到处找,到处改啦。
要说明的,上面代码片断中,被注释掉的一行,居然就是我这里出现“java.lang.IllegalStateException: Active Spring transaction synchronization or active JTA transaction with specified [javax.transaction.TransactionManager] required”这个异常的罪魁祸首,把这一行注释掉,整个世界都和谐了
Read more…
Java, Programming BLOB, Hibernate, Sprint, 上传文件
有时候,我们需要将读取文件的内容到一个byte[] 数组中,然后对这个数组进行一些修改,这时,我们可以借助于 ByteArrayOutputStream 这个类来实现。
ByteArrayOutputStream,顾名思义,同样是一个OutputStream,那么,对于它的写入操作,和其他的OutputStream应该是没有什么两样,写入代码可以说是随手拈来的,与其他输出流的不同之处在于,ByteArrayOutputStream写入到内存中,并提供一个 toByteArray() 方法返回我们所需要的byte[]。
下面,用一小段代码,具体演示一下如何操作,希望菜鸟同志们都能明白吧。
示例中,用了BufferedInputStream,每次读取1k数据 。
package org.apache.demo;
import java.io.BufferedInputStream;
import java.io.ByteArrayOutputStream;
import java.io.FileInputStream;
import java.io.IOException;
public class Stream2Byte {
public static void main(String[] args) throws IOException {
BufferedInputStream in = new BufferedInputStream(new FileInputStream("/media/music/hello.ogg"));
ByteArrayOutputStream out = new ByteArrayOutputStream(1024);
System.out.println("Available bytes:" + in.available());
byte[] temp = new byte[1024];
int size = 0;
while ((size = in.read(temp)) != -1) {
out.write(temp, 0, size);
}
in.close();
byte[] content = out.toByteArray();
System.out.println("Readed bytes count:" + content.length);
}
}
Java byte[], Java IO, Java读文件
先前一直都没有发现这个问题,知道昨天很偶然的在Firefox下点了一下一个本已经本禁用的按钮,原本想是不会有任何效果的,结果却触发了点击事件…… 之前在IE下曾经是测试过的,禁用状态下,点击事件是不会被触发的。
马上去Google,忙了半天,也没有搜索到什么相关的结果,这样只能说明一个问题,那就是ExtJS本身是不存在这个问题的,肯定是自己代码存在问题啦!
仔细拿来读读看:
var panel = new Ext.Panel({
tbar:[{
text:'添加',
iconCls:'add',
disabled:true,
onClick:function(){
alert('执行添加操作!');
}
}]
});
将其中的onClick,换成handler即可解决这个问题,一时大意
JavaScript, Programming Disable, ExtJS, Firefox
ExtJS中有很多的Panel,比如GridPanel和TreePanel等等,有时候,我们需要给这些Panel的body里设置上一个最小高度,当超过最小高度的时候整个Panel又能够自动变高。
Firefox支持min-height这个属性,可以直接定义最小高度,而在IE下并没有这么简单,考虑到不同的IE版本,只有通过设置一个固定高度的height值,也就是最小高度值,然后再设定其高度为自动,并加上!important。
具体来说,应该是类似于这样的代码
.mypanel {
height:auto !important;
height:90px;
min-height:90px;
}
但是,很郁闷的事情是在ExtJS里,如果将!important添加到bodyStyle里,不仅没有效果,反而会报错! 经过多次试验,最后找到一个相对来说算是比较完美的解决办法:将css代码添加到bodyCfg属性中!
var panel = new Ext.Panel({
title:'带最小高度的Panel',
frame:true,
collapsible:true,
style:'margin:5px;', // 设置整个Panel周围间隔5个像素
bodyCfg:{
style:'border:solid 1px #99bbe8; padding-botom:2px; background-color:#ffffff; height:auto!important; height:90px; min-height:90px;'
}
});
Programming Ext.Panel, Firefox, min-height
很久没有更新,因为最近一直都在做很多无谓的事情。感觉而且的确是很忙,但是似乎又的确是没有任何的进展与成果。
终于见识到ZF的办事效率,也终于遇上了拖欠工资,感觉上自己与农民工无异,或者并不如。
昏天黑地地忙着应付手上的项目,满脑子想着很多很多迫切需要去做的事情,感觉一天48时候都不够,不过可恨的事情是春天的觉咋就这么好睡?
博客有一段时间没有打理,倒成了Spam的天堂了,每天N条的垃圾评论,一段时间累积下来,都上百条了……
在见识过Ubuntu9.04 Beta之后,还是选择了Windows7 build7077. 虽然都是非正式版,不过总体感觉Ubuntu越来越没有3年前的很好很强大的感觉,windows7也一改了Vista的臃肿与耗油。
看到自己07年写在BlogJava上的一篇关于将dTree搞成Ajax动态加载的拙文被“广为流传”,心里并没有丝毫的窃喜,反而似乎很是厌恶,不知道是否是自己心理有问题了。很厌恶,厌恶随便百度一个关键字,出来NNNNN篇一模一样的网页,很厌恶!当遇到难题时,迫切需要的不是一篇又一篇的重复,需要有更多更全面的参考资料。所以,干正事从来不靠Baidu。这,也正是JavaTOY采用E文的原因之一吧。:(
说到JavaTOY,似乎又该狠狠地叹息一番,同样是很长时间没有更新,等我上4钻,等我考完试,一定好好地,好好地拾掇拾掇!
Journal JavaTOY, Ubuntu, Windows7, 无谓
在经过了一段时间的筹备之后,JavaTOY终于上线了,期间和LunarPages.com和PayByCash.com交涉了太多,最终还是没能在LunarPages注册上域名。
JavaTOY,域名采用javatoy.org,自认为还是比较好记,目的也还算明确吧。在JavaTOY的Description里我是这样写的:
JavaTOY is dedicated to providing information about the topic of Java programming language. its features include the news of Java, new software introduction, fun games recommend, practical reference tutorials and so on.
至于说为什么要建JavaTOY这样一个站点,是因为,自己从事Java开发已经多年,却一直都没有发现国内有比较让自己中意的站点,能够比较专注于Java领域的新闻,提供一些开源项目的介绍,或是其他的,自己也不是很能说得上来,反正,总的一个感觉是,国内的网站,就一个字——“抄”! 只要有一篇文章被发表,从发表的那一刻起,就已经注定无疑要被复制、粘贴,当然还有很多人会在此基础上进行“创作”,结果会使得文章越来越脱离原题,最后面目全非,直至最终,指鹿为马!
如果仅是抄抄也还是好的。总还是尊重原著的嘛, 最可气的是把开头和结尾“稍作修饰”就变成原创,这样的文章,实在是没有办法看下去。
好啦,不是要来发表檄文,或是要评价什么,说回JavaTOY。
JavaTOY里发表的文章,将都是经过本人悉心整理过的,不保证是原创的,如果转载,肯定会注明出处,如果是书摘,肯定一样会有书名。
最好要说明的是JavaTOY网站将会由始至终一直沿用万恶的鸟文,虽然自己的鸟文很菜,但是还是选择了鸟文,一则挑战自己,二则不用考虑会有人复制,呵呵。
稍后会奉上JavaTOY的更多细节
Google Adsense, Java Java, JavaTOY
很郁闷的事情,因为自己太信任工行,太大意,昨天买了工行的U盾,想都没想,直接把安装盘往光驱里一放,一路NEXT下来,VISTA蓝屏收场!
当再GHOST回来的时候,发现郁闷的事情,快速启动栏不见了,经过一般的Google,终于算是解决了,U盾也下了Vista下的专用驱动可以使用了,现记录一下找回VISTA快速启动栏的方法。
快速启动栏是保存在C:\Users\用户名\AppData\Roaming\Microsoft\Internet Explorer\Quick Launch下的文件,要找回工具栏,先确定以上目录存在,并且保证以上目录均未被隐藏。
如果是系统自动建立的可能其中某些文件夹是隐藏的并带有系统属性,请在命令行下: attrib -s -h “文件夹名字”,以上命令用于去除文件夹的系统属性和隐藏属性。
找到C:\Users\Default\AppData\Roaming\Microsoft\Internet Explorer将整个文件夹复制到C:\Users\用户名\AppData\Roaming\Microsoft\Internet Explorer\即可。
至于工行U盾在VISTA下蓝屏的解决办法则是在捷德的官方网站上去下载StarKeyDriver_Vista 的驱动即可。
Journal Quick Launch, U盾, Vista, 快速启动栏, 蓝屏