ExtJs学习笔记(18)_ExtJs嵌入FCK示例

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns="">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <link rel="stylesheet" type="text/css" href="../resources/css/ext-all.css" />
   <script type="text/javascript" src="../adapter/ext/ext-base.js"></script>
  <script type="text/javascript" src="../ext-all-debug.js"></script>
  <script type="text/javascript" src="../Extjs_Intellisense.js"></script>
  <script type="text/javascript" src="../fckeditor/fckeditor.js"></script>
  <title>Layout_Border示例</title>
</head>
<body>

<script type="text/javascript">
  Ext.onReady(function() {

    var win = new Ext.Window({
      title: "修改个人信息",
      width: 800,
      height: 410,
      layout: "fit",
      modal: true,
      frame: true,
      plain: true,
      resizable: false,
      items: new Ext.TabPanel({
        activeTab: 0,
        frame: true,
        items:
          [
            {
              title: "个人信息",
              items:
              [{
                title: "自我介绍",
                xtype: "textarea",
                id: "fckInstance",
                name:"fckInstance",

              }],
              buttons: [{ text: "保存"}]
              }
          ]
      })
    });

    win.show();

    var fckobj = new FCKeditor('fckInstance', "100%", "100%");
    fckobj.ToolbarSet = 'Default';
    fckobj.ReplaceTextarea();
  });

</script>
</body>
</html>

时间: 2024-09-08 15:08:09

ExtJs学习笔记(18)_ExtJs嵌入FCK示例的相关文章

ExtJs学习笔记(19)_复杂Form示例

Form布局在所有布局中是最为复杂,使用频度最广,同时也是最难掌握的,下面给出几个示例 1.登录UI界面 Login UI <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/x

ExtJs学习笔记

ExtJS学习笔记 - onReady Extjs学习笔记 - 实战 Extjs学习笔记 - 初篇 ExtJs学习笔记(24)-Drag/Drop拖动功能 ExtJs学习笔记(23)-ScriptTagProxy+XTemplate+WCF跨域取数据 ExtJs学习笔记(22)-XTemplate + WCF 打造无刷新数据分页 ExtJs学习笔记(21)-使用XTemplate结合WCF显示数据 ExtJs学习笔记(20)-利用ExtJs的Ajax与服务端WCF交互 ExtJs学习笔记(19)

API Demos 2.3 学习笔记 (18)-- Views-&amp;gt; ScrollBars

更多精彩内容,请点击阅读:<API Demos 2.3 学习笔记> 当一个控件的内容太多,超过了控件的可视范围,就会有一部分内容无法显示出来.这时,我们需要ScrollView控件的帮忙.用ScrollView把该控件包起来,超过控件可视范围的内容,将可以通过滚动来实现浏览. 下面简单介绍下ScrollView的创建和使用方法. 1.如下所示,由于TextView控件太多,导致一屏无法全部显示.首先,在布局文件中用 LinearLayout把这些TextView控件包起来,然后再用Scroll

ExtJs 学习笔记 Hello World!第1/2页_extjs

在了解基础后,可能会用Ext+ajax开发一个简单的小项目,会一点一滴的讲解项目开发过程,希望能给大家带来收获!因为我本人也在学习这个框架,所以对文章有什么建议请提出,这样可能会让我学到更多. 看到这幅图,你可能认为是某个软件,或者是Flash.Flex.silverlight等等,但这是javascript+Css实现的.       在看这样式与效果,如果加在自己的项目里,用户视觉与操作的体验应该会很爽吧. 还有更多的特效就不一一截图了.      下面开始说一下这个组件,ExtJs是一个不

extjs 学习笔记(一) 一些基础知识_extjs

我在项目中已经频繁使用了jquery,这次主要是学习使用extjs,但现有的教程基本都是针对2.0的,而且后台用到的语言也很少是.net平台下的C#,所以我打算针对3.0版,后台使用C#,记录下自己的学习过程,希望能和志同道合的朋友一起探讨,共同进步. extjs的官方网站是http://www.extjs.com,目前最高版本是3.0.2,但是只有3.0.0的才没有任何下载限制,可以点击这里下载3.0版的.下载来的压缩包里边包含压缩后的extjs库,调试时用到的库,具有可读性的源代码,文档和例

Extjs学习笔记之七 布局_extjs

Extjs Layout Browser . Extjs3.1.0 版本支持17种,下面挑一些重要的简要的说明一下,要看效果,去上面给的链接,不再贴图了.给Panel设置Layout的方法是一样的,就是设置Panel的Layout配置项.1. AbsoluteLayout 可以通过Panel内部组件的决定位置来布局.通过x,y来指定. 示例用法: 复制代码 代码如下: new Ext.Panel({ layout: 'absolute', title: 'AbsuluteLayout', ren

Extjs学习笔记之三 extjs form更多的表单项_extjs

1.日期选择框,DateField 日期选择框在日常项目中被广泛应用,一个方便的日期输入机制能够极大的提高用户体验.Extjs的DateField非常友好灵活强大.可以通过如下代码新建一个日期选择框: 复制代码 代码如下: new Ext.form.DateField({ id: 'diliveryDate', format: 'Y年m月d日', maxValue: new Date(), minValue: '1900-01-01', disabledDays: [0, 6], disable

ExtJs 学习笔记 Ext.Panle Ext.TabPanel Ext.Viewport第1/3页_extjs

通过此文能学习到如下内容 1.创建一个简单的面板 Ext.Panel 2.制作一个可以拖动的面板 Ext.Panel 3 .使用选项卡面板 3.使用Ext.Viewport搭一个简单布局(用一个小例子来总结本文所有内容) 面板是ExtJs控件的基础,很多控件都是在面板的基础上扩展的,或者他会与其他控件之间有关系. 面板由一个工具栏.一个底部工具栏.面板头部.面板尾部和面板主区域几个部分组成.面本类中还提供了面板展开.关闭等功能.并提供了一些可重用的工具按钮让我们灵活的控制面板.面板可以放入其他任

ExtJs学习笔记(5)_Ajax示例

ExtJs对于Ajax的使用非常简单,看下面的代码: 1.Html页: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head &