YouTipPlugins Window Messager
# jQuery EasyUI Window Plugin - Messager Message Box
* * jQuery EasyUI Plugins](#)
* * *
Override the default defaults via $.messager.defaults.
The messager provides different styles of message boxes, including alert, confirm, prompt, progress, etc. All message boxes are asynchronous. Users can use callback functions to perform actions after interacting with the message box.
!(#)
## Dependencies
* window
* linkbutton
* progressbar
## Usage
```javascript
$.messager.alert('Warning','The warning message');
$.messager.confirm('Confirm','Are you sure you want to delete record?',function(r){
if (r){
alert('ok');
}
});
## Properties
| Name | Type | Description | Default |
| :--- | :--- | :--- | :--- |
| ok | string | The text for the OK button. | Ok |
| cancel | string | The text for the Cancel button. | Cancel |
## Methods
| Name | Parameter | Description |
| :--- | :--- | :--- |
| $.messager.show | options | Show a message window at the bottom-right corner of the screen. The `options` parameter is a configuration object: showType: Defines how the message window is shown. Available values: null, slide, fade, show. Default is slide. showSpeed: Defines the time in milliseconds for the message window to complete showing. Default is 600. width: Defines the width of the message window. Default is 250. height: Defines the height of the message window. Default is 100. title: The title text displayed on the header panel. msg: The message text to display. style: Defines custom styles for the message window. timeout: If defined as 0, the message window will not close unless the user closes it. If defined as a non-0 value, the message window will close automatically after the timeout. Default is 4 seconds. Code example: ```javascript $.messager.show({title:'My Title',msg:'Message will be closed after 5 seconds.',timeout:5000,showType:'slide'}); // show message window on top center $.messager.show({title:'My Title',msg:'Message will be closed after 4 seconds.',showType:'show',style:{right:'',top:document.body.scrollTop+document.documentElement.scrollTop,bottom:''}}); ``` |
| $.messager.alert | title, msg, icon, fn | Show an alert message window. Parameters: title: The title text displayed on the header panel. msg: The message text to display. icon: The icon image to display. Available values: error, question, info, warning. fn: The callback function triggered when the window is closed. Code example: ```javascript $.messager.alert('My Title','Here is a info message!','info'); ``` |
| $.messager.confirm | title, msg, fn | Show a confirmation message window. Parameters: title: The title text displayed on the header panel. msg: The message text to display. fn: The callback function triggered when the window is closed. The parameter `r` is true if the user clicks the OK button, false otherwise. Code example: ```javascript $.messager.confirm('Confirm','Are you sure you want to delete record?',function(r){ if (r){ alert('ok'); } }); ``` |
| $.messager.prompt | title, msg, fn | Show a prompt message window. Parameters: title: The title text displayed on the header panel. msg: The message text to display. fn: The callback function triggered when the window is closed. The parameter `val` is the value entered by the user. Code example: ```javascript $.messager.prompt('Prompt','Please enter your name:',function(val){ if (val){ alert('Your name is: ' + val); } }); ``` |
| $.messager.progress | options or method | Show a progress message window. The `options` parameter is a configuration object: title: The title text displayed on the header panel. Default is ''. msg: The message text to display. Default is ''. text: The text displayed on the progress bar. Default is ''. interval: The time interval in milliseconds to update the progress bar. Default is 300. The method can be 'close' to close the progress window. Code example: ```javascript var win = $.messager.progress({ title:'Please waiting', msg:'Loading data...' }); // close the progress window after some time setTimeout(function(){ $.messager.progress('close'); }, 3000); ``` |