关于Ext.MessageBox属性

 对于Ext.MessageBox这个功能，我们在程序中是经常用到的，我们经常用它来做一些提示，就像我们以前用alert一样，但是传统的alert的功能太单一了，而且它是中断页面操作的，在Ext里面对于这个功能做了一些比较好的扩展，1.1版本的和2.0版本的用法是一样的，只是弹出的样式有些变化，我个人更喜欢1.1版本那个弹出的样式很漂亮。2.0版本的对话框觉得太普通了，我现在还不能对样式进行修改，所以目前还没办法，等以后研究一下，我想可以兼容这两种模式吧。

    我首先翻译一下ExtApi文档里面关于对话框的描述吧，我觉得它说的已经很好了，没有必要我进行重复，原文如下：

Utility class for generating different styles of message boxes. The alias Ext.Msg can also be used.

Note that the MessageBox is asynchronous. Unlike a regular JavaScript alert (which will halt browser execution), showing a MessageBox will not cause the code to stop. For this reason, if you have code that should only run after some user feedback from the MessageBox, you must use a callback function (see the function parameter for show for more details).

这个功能类是生成各种不同类型的信息框，也可以用别名Ext.Msg。

注意：MessageBox是异步的，不同于传统的JavaScript的alert(这个将挂起浏览器的运行），展示MessageBox的时候将不会停止代码的运行（也就是如果这个时候我们后面有代码，它将继续执行下去，我在用的时候就体会到了这一点，比如我们弹出一个框提示是否关闭一个Form，这个时候不等我们点确定，实际上后面的form已经关闭了，当然我在下面的叙述中，能够避免这一点），由于这个原因，如果你希望你的代码只有在你的用户反馈之后运行话，你必须使用callback功能。

我想上面的翻译对于我们使用这个功能已经足够了，那么我在下面将解释一下具体的各个参数的意义。也会拿出一个例子来给大家看一下，我就用文档里面的例子吧，它一共有三种模式，如下面：

// Basic alert:这是最基本的一种，只会弹出一个确定按钮，在这里多说一点，很多人发现它的Ext

不能弹出中文的按钮，原因在于你没有使用中文包，具体用法就是在包含所有的js包之后，再加上一个

<script type="text/javascript" src="../ext20/build/locale/ext-lang-zh_CN.js"></script>

这样你的对话框弹出时，按钮里面就是中文了。
Ext.Msg.alert('Status', 'Changes saved successfully.');
上面这个功能比较简单，前面的参数会出现在标题上，后面的是具体的信息。当然它还有一个形式就是加上callback

比如这样Ext.MessageBox.alert('Status', 'Changes saved successfully.', showResult);

showResult就是我们在点击按钮后要执行的函数，几乎所有的回调都是这么用的，所以大家一定要记住这个方法。

实际上这个时候别看形式上没有参数，但是还是要传递一个参数过去的，所以showResult函数可以这么写

function showResult(btn)，那么这个时候btn就是传递过来的参数，你可以alert一下，看看它是什么。
// Prompt for user data and process the result using a callback:
Ext.Msg.prompt('Name', 'Please enter your name:', function(btn, text){
    if (btn == 'ok'){
        // process text value and close...
    }
});
上面这个形式有高级一些，他可以传递两个参数过去，就是说我们可以在提示框里面输入一些文字，并且把这些问题

通过ajax传递到我们的后台程序去。也就是我们在if (btn == 'ok'){里面加上我们的提交功能。

// Show a dialog using config options:
Ext.Msg.show({
   title:'Save Changes?',
   msg: 'Your are closing a tab that has unsaved changes. Would you like to save your changes?',
   buttons: Ext.Msg.YESNOCANCEL,
   fn: processResult,
   animEl: 'elId',
   icon: Ext.MessageBox.QUESTION
});

对于上面这个形式的对话框，可能我们会用的少一些，普通一点前面两个就基本够用了，而这个形式也是最复杂的形式，参数也很多

基本上一看就明白，而且1.1的和2.0的参数的形式是一样的，可以直接照搬，不用进行修改。

title是标题，msg是显示的具体信息，buttons则是要提示的按钮，按钮有几种形式我列出来，大家一看就明白：CANCEL，OK，OKCANCEL，

YESNO，YESNOCANCEL

icon就是显示在对话框上面的图标，也有几个可选项：ERROR，INFO，QUESTION，WARNING

fn:就是我们要执行的函数了，这个以后进行解释，我们可以在里面执行很多功能。

animEl:是我们将这个对话框渲染到什么组件里面，这里填写的是组件的id。

下面需要解释的是另外一个参数buttonText ，这个参数的意义是覆盖我们原来在按钮上面的文字，这是一个特殊的设计，如果我们加载了我上面

提到的中文包也许我们不会用到这个功能，但是有一些时候我们会有特殊的要求，那么这个时候可以用这个属性来改变按钮上面的文字。用法是这样的

Ext.MessageBox.buttonText.yes = "是"; 

defaultTextHeight : 这个属性应该是一个数字，它是以 pixels 为单位来表示显示在对话框里面的多行文本框的高度，默认是75。

maxWidth :这个表示对话框最大宽度，默认值600,单位也是pixels,minWidth : 最小宽度默认100.

基本上我们对话框的属性就这么多了，功能很丰富，而且用起来也很方便，我觉得如果我们把这样的对话框用起来，绝对自己看着都很有成就感。

但是对于这个类来说，我还没有介绍完，因为在这个类里面，Ext还加入的一个进度条的功能，那么就多了一个属性出来：

minProgressWidth : 这个属性限制进度条的最小宽度，默认值是250,呵呵。

后面关于方法还有很复杂的用法，我将来下一篇里面介绍。