[置顶] EXT/FCKEditor 集成 -- AJAX UI -- 一种web开发的新的思维-白红宇的个人博客

[置顶] EXT/FCKEditor 集成 -- AJAX UI -- 一种web开发的新的思维

发布日期：2021-11-17 11:50:31 浏览次数：2 分类：技术文章

本文共 5310 字，大约阅读时间需要 17 分钟。

代码如下,刚学习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" "">

<html>

<head>

<title>EXT/FCKEditor 集成 -- AJAX UI -- 一种web开发的新的思维,要及时转换思想</title>

</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',{

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

转载地址：https://blog.csdn.net/vb2005xu/article/details/52539658 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！

上一篇：[置顶] ajax实时任务提示功能的实现 -- vb2005xu自己动手系列(1)

下一篇：[置顶] Windows下DLL编程技术及应用

发表评论

关于作者

喝酒易醉，品茶养心，人生如梦，品茶悟道，何以解忧？唯有杜康！

-- 愿君每日到此一游！

发表评论

最新留言

关于作者

推荐文章