ext2.2学习笔记二

huoming550

浏览: 413297 次
性别:
来自: 广州

最近访客更多访客>>

changeself

zhou5262721

fanfree

liuyouming

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

EXT Ajax JavaScript

ext2.2学习笔记二
关键字: ext, getcmp
为什么有的例子必须放在服务器上才能看到效果？

因为有些例子里，用到Ajax去后台读取数据，如果没在服务器上，Ajax返回的状态一直是失败，也无法获得任何数据，所有就看不到正确的效果。不过以前在extjs.com论坛上看到过有人写了localXHR，可以让ajax从本地文件系统获得数据，这样也许就可以摆脱服务器的束缚了。

好现在开始讲例子了：

第一：Ext.getCmp("对象ID")　:该方法只有一个参数，就是组件的 ID

//第二: Ext.getBody();//该方法等同于document.body 呵呵不用说了吧
//以上是我经常使用的2个方法,

说明：在执行下面的语句后，点击确定会弹出定义的Ext按钮的一些属性值，同时将原来的值由"确定"更改为"取消"

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>ExtJS</title>
<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.js"></script>
<script type="text/javascript" src="../examples.js"></script>
</head>
<body>
    <form id="form1"
    <div>
    <%--既然Ext是基于javascript的，所以我们要把Ext的东东包裹在javascript里面--%>
   <script type="text/javascript">
    function ready()
    {
        //这个函数的主要作用有两个：
        //一个获取定义的buttonName按钮。有消息弹出结果
        //另一个就是将buttonName按钮值由"确定"更改为"取消"
        var setText = function()
        {
            //通过getCmp方法获取指定参数的对象，参数的值是某个已经在页面中初始化的Ext对象的ID
            //getCmp()方法只有一个参数，就是组件的 ID
            var btn = Ext.getCmp("buttomID");

            //获取按钮ID
            var id = btn.id;

            //获取按钮文本
            var text = btn.text;

            //获取按钮类型
            var type = btn.type;

            var result = "执行结果是：ID="+id+" text="+text+" type="+type;

            Ext.Msg.alert("提示消息",result);

            //setText是将按钮的文本重新设置为新的文本“取消”
            Ext.getCmp("buttomID").setText("取消");
        };
        //定义一个按钮出发事件后执行函数setText
        var buttonName = new Ext.Button
        ({
            id:"buttomID",
            text:"确定",
            renderTo:document.body,
            handler:setText
        });
    }
    Ext.onReady(ready);

    </script>
    </div>
    </form>
</body>
</html>

效果如图：

分享到：

ext2.2学习笔记三 | 如何部署ext!

2008-11-21 16:21
浏览 1201
评论(0)
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论