EXT/FCKEditor 集成 -- AJAX UI -- 一种web开发的新的思维
代码如下,刚学习EXT,感觉比使用DOJO畅快许多,不像<<征服AJAX dojo,prototype,script.aculo.us>>书中作者使用的DOJO是0.4的版本,我下的是1.1的版本,结果许多组件的命名空间都变了,书中讲的代码等于是废的.前面的prototype,script.aculo.us到是讲的不错,但是不深. 所以后面自己也就废弃了DOJO的学习,学习了EXT.
我是PHP程序员,做PHP也就意味着不能像JAVA,.NET一样使用服务器端组件,更没有服务端AJAX组件了...
我是从JAVA web开发者转到PHP的,之前参与过北京市旅游局系统二期改造项目和中关村高新技术园调查的开发,
使用工作流组件开发相当快. 转到PHP后刚开始有些不太适应,几个月后也就适应了,学习到了很多东西.包括开发思维的转变.
这里总结了一些经验:
1. 使用一套PHP4/PHP5兼容框架,推荐使用FLEAPHP,使用好几个月了,相当的好用.
2. 熟悉SMARTY 这个模板框架是必须学会的,即使你是程序员
3. 熟悉MVC结构,这个是最重要的.如果你不想在后期狂改代码的话
[对于PHP我只分出VC和DAO层,一般只需要这两个]
4. 要求会使用JS开发,知道使用OOP来写JS. 至少熟悉Prototype框架
5. 对做企业应用的话EXT是不能少的,虽然我到现在还不知道它的版权到底是怎样的.我没有找到
[说是GPL3 或者LGPL 但是仍然要收费,做多个项目是不是要求购买OEM版的,我也不知道,所以决定购买一套UCREN]
index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>EXT/FCKEditor 集成 -- AJAX UI -- 一种web开发的新的思维,要及时转换思想</title>
<link rel="stylesheet" type="text/css" href="/ucren/extjs/js_source/resources/css/ext-all.css" />
<script type="text/javascript" src="/ucren/extjs/js_source/ext-base.js"></script>
<script type="text/javascript" src="/ucren/extjs/js_source/ext-all.js"></script>
<!-- //具体事例 -->
<script type="text/javascript" src="/ucren/fckeditor/fckeditor.js"></script>
<script type="text/javascript" src="/ucren/extjs/app/extfckapp/FckExtjsCall.js"></script>
</head>
<body>
<!-- //页面中子导航菜单 -->
</body>
</html>
FckExtjsCall.js
Ext.onReady(function() {
var fckFormObj = new Ext.FormPanel({
labelWidth:75,
url:"",
title:"EXT/FCKEditor 集成 -- vb2005xu | cdlinux.ys168.com",
bodyStyle:"padding:5px 5px 0",
defaultType:"form",
buttons:[
{
text:"Save" ,
type:'submit',
handler: function(){
//获取fckeditor内容赋给textarea
Ext.get('fckInstance').dom.value = "jjj";//fckobj.GetXHTML(true) + '提交后';
Ext.MessageBox.alert('FCK内容',Ext.get('fckInstance').dom.value);
if (fckFormObj.form.isValid())
{
//创建响应测试函数
var fckobj_temp = FCKeditorAPI.GetInstance('fckInstance');
//fckobj_temp.UpdateLinkedField();//此方法被绑定到submit事件
fckFormObj.form.doAction('submit',{
url:'submit.php',
method:'post',
waitMsg:'正在提交,请稍等...',
success:function(form,action){//成功
showInfo('Success',fckobj_temp.GetXHTML(true));
} ,
failure:function(form,action){//失败
showInfo('Failed','网络中断造成连接失败');
}
});
}
}
},
{
text:"Cancel"
}
],
items:[{
xtype:"textarea",
fieldLabel:"编辑",
labelSeparator:"：",
id:"fckInstance", //div节点，这里要挂接FCKeditor编辑器
name:"fckInstance",
width:736,
height:371
}]
});
fckFormObj.render(document.body);
/*创建Fckeditor对象 -- 构造函数指出了Fckeditor要挂接的id,上文中的xtype : 'textarea'指定*/
//在页面上要求挂载fckeditor/fckeditor.js文件
var fckobj = new FCKeditor('fckInstance',810,350);
fckobj.BasePath = "/ucren/fckeditor/" ;
fckobj.ToolbarSet = 'Default' ;
fckobj.ReplaceTextarea();
//创建响应测试函数
function msgBox()
{
var fckobj_temp = FCKeditorAPI.GetInstance('fckInstance');
fckobj_temp.UpdateLinkedField();//此方法被绑定到submit事件
Ext.MessageBox.alert('FCK内容',fckobj_temp.GetXHTML( true ));
}
function showInfo(tip,str){
var win = new Ext.Window({
title: '信息提交应答提示 -- ' + tip,
width: 400 , height: 200 ,autoScroll: true ,
html: '<h1>'+ str +'</h1>'
});
win.show();
}
});
submit.php
这个是一个空文件 可以自己添加内容 .
以下是工程代码结构图
卷 kong 的文件夹 PATH 列表
卷序列号码为 00003AB9 6CED:1D77
G:.
├─.cache
├─.settings
├─blog
├─extjs
│ ├─app
│ │ ├─extfckapp
│ │ └─ExtremeWebManager
│ └─js_source
│ └─resources
│ ├─css
│ └─images
│ ├─default
│ │ ├─box
│ │ ├─button
│ │ ├─dd
│ │ ├─editor
│ │ ├─form
│ │ ├─grid
│ │ ├─layout
│ │ ├─menu
│ │ ├─panel
│ │ ├─progress
│ │ ├─qtip
│ │ ├─shared
│ │ ├─sizer
│ │ ├─slider
│ │ ├─tabs
│ │ ├─toolbar
│ │ ├─tree
│ │ └─window
│ ├─gray
│ │ ├─button
│ │ ├─panel
│ │ ├─qtip
│ │ ├─tabs
│ │ ├─toolbar
│ │ └─window
│ └─vista
│ ├─basic-dialog
│ ├─grid
│ ├─layout
│ ├─qtip
│ ├─sizer
│ ├─tabs
│ └─toolbar
├─fckeditor
│ └─editor
│ ├─css
│ │ ├─behaviors
│ │ └─images
│ ├─dialog
│ │ ├─common
│ │ │ └─images
│ │ ├─fck_about
│ │ ├─fck_docprops
│ │ ├─fck_flash
│ │ ├─fck_image
│ │ ├─fck_link
│ │ ├─fck_select
│ │ ├─fck_spellerpages
│ │ │ └─spellerpages
│ │ │ └─server-scripts
│ │ └─fck_template
│ │ └─images
│ ├─dtd
│ ├─filemanager
│ │ ├─browser
│ │ │ └─default
│ │ │ ├─images
│ │ │ │ └─icons
│ │ │ │ └─32
│ │ │ └─js
│ │ └─connectors
│ │ ├─asp
│ │ ├─aspx
│ │ ├─cfm
│ │ ├─lasso
│ │ ├─perl
│ │ ├─php
│ │ └─py
│ ├─images
│ │ └─smiley
│ │ └─msn
│ ├─js
│ ├─lang
│ ├─plugins
│ │ ├─autogrow
│ │ ├─bbcode
│ │ │ └─_sample
│ │ ├─dragresizetable
│ │ ├─placeholder
│ │ │ └─lang
│ │ ├─simplecommands
│ │ └─tablecommands
│ ├─skins
│ │ ├─default
│ │ │ └─images
│ │ ├─office2003
│ │ │ └─images
│ │ └─silver
│ │ └─images
│ └─_source
│ ├─classes
│ ├─commandclasses
│ └─internals
├─json
├─phplibs
│ ├─FLEA
│ │ ├─FLEA
│ │ │ ├─Ajax
│ │ │ ├─Com
│ │ │ │ └─RBAC
│ │ │ │ └─Exception
│ │ │ ├─Config
│ │ │ ├─Controller
│ │ │ ├─Db
│ │ │ │ ├─Driver
│ │ │ │ └─Exception
│ │ │ ├─Dispatcher
│ │ │ │ └─Exception
│ │ │ ├─Exception
│ │ │ ├─Filter
│ │ │ ├─Helper
│ │ │ ├─Rbac
│ │ │ │ └─Exception
│ │ │ ├─Session
│ │ │ ├─View
│ │ │ │ └─Exception
│ │ │ └─_Errors
│ │ │ ├─chinese-gb2312
│ │ │ ├─chinese-utf8
│ │ │ ├─default
│ │ │ └─_common
│ │ └─_Cache
│ └─Smarty
│ ├─internals
│ └─plugins
├─prototype
├─taskofpig
│ ├─Controller
│ ├─Dao
│ ├─js
│ ├─music
│ ├─tpl
│ ├─tpl_c
│ └─_log
├─ucren-documentation
│ ├─common
│ └─images
│ └─bigicons
└─ucren-engine
├─classes
│ ├─animation
│ ├─net
│ └─patch
└─resource
└─skins
└─qq