$.messager.progress ajax,messager - Documentation - jQuery EasyUI

Messager

Override defaults with $.messager.defaults.

the messager provide different styles of message boxes, including alert, confirm, prompt, progress, etc.

All the messager boxes are asynchronous.

Users can use the callback function to do something after interacting with messager.

Dependencies

dialog

linkbutton

progressbar

Usage

$.messager.alert('Warning','The warning message');

$.messager.confirm('Confirm','Are you sure you want to delete record?',function(r){

if (r){

alert('ok');

}

});

Properties

The properties extend from dialog, below is the added properties for messager.

Name

Type

Description

Default

ok

string

The Ok button text.

Ok

cancel

string

The Cancel button text.

Cancel

msg

string

The message to display on the dialog.

fn

function

The callback function when clicking on the OK or CANCEL buttons.

Methods

Name

Parameters

Description

$.messager.show

options

Show a message window on right bottom of screen. The options parameter is a configuration object:

showType: Defines how the message window to be showed. Available values are: null,slide,fade,show. Defaults to slide.

showSpeed: Defines the time in milliseconds message window finishs show. Defaults to 600.

width: Defines the width of message window. Defaults to 250.

height: Defines the height of message window. Defaults to 100.

title: The title text to be showed on header panel.

msg: The message text to be showed.

style: Defines the custom style for message window.

timeout: If defines to 0, the message window will not close unless user close it. Defines to unzero, the message window will be auto closed when timeout. Defaults to 4 seconds.

Code example:

$.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 window. Parameters:

title: The title text to be showed on header panel.

msg: The message text to be showed.

icon: The icon image to be showed. Available value are: error,question,info,warning.

fn: The callback function triggered when clicking on the OK button.

The configuration object can be passed to the function argument.

Code example:

$.messager.alert('My Title','Here is a info message!','info');

$.messager.alert({

title: 'My Title',

msg: 'Here is a message!',

fn: function(){

//...

}

});

$.messager.confirm

title, msg, fn

Show a confirmation message window with Ok and Cancel buttons. Parameters:

title: The title text to be showed on header panel.

msg: The message text to be showed.

fn(b): The callback function, when user click Ok button, pass a true value to function, otherwise pass a false to it.

The configuration object can be passed to the function argument.

Code example:

$.messager.confirm('Confirm', 'Are you sure to exit this system?', function(r){

if (r){

// exit action;

}

});

$.messager.confirm({

title: 'My Title',

msg: 'Are you confirm this?',

fn: function(r){

if (r){

alert('confirmed: '+r);

}

}

});

$.messager.prompt

title, msg, fn

Show a message window with Ok and Cancel buttons prompting user to enter some text. Parameters:

title: The title text to be showed on header panel.

msg: The message text to be showed.

fn(val): The callback function with a value parameter user entered.

The configuration object can be passed to the function argument.

Code example:

$.messager.prompt('Prompt', 'Please enter your name:', function(r){

if (r){

alert('Your name is:' + r);

}

});

$.messager.prompt({

title: 'Prompt',

msg: 'Please enter your name:',

fn: function(r){

if (r){

alert('Your name is:' + r);

}

}

});

$.messager.progress

options or method

Show a progress message window.

The options is defined as:

title: The title text to be showed on header panel, default ''.

msg: The message box body text, default ''.

text: The text to display in the progress bar, default undefined.

interval: The length of time in milliseconds between each progress update, default 300.

The method is defined as:

bar: Get the progressbar object.

close: Close the progress window.

Code example:

Show progress message window.

$.messager.progress();

Now close the message window.

$.messager.progress('close');