|Classes of Christian Vigh||jQuery msgbox||README.md||Download|
The jQuery object will provide you with the following functions :
Additionnally, you can use the $.wait() function to display a wait message while performing some processing.
There is also a (redundant) $.msgbox() function, which mimics the Windows API function MessageBox.
HOW DOES IT WORK ?
You first need to include jQuery and jQuery UI :
Then include a theme for styling elements specific to message boxes ; I provide a customized theme, thrak, based on the redmond theme, with additions for message boxes :
Finally, include the source file :
Calling the native message box functions of your browser is straightforward : call the function and you will be sure that the next instruction after the call will only be executed when the call has completed, ie when the user has closed the message box :
Msgbox functions usually take at least 3 arguments :
You can specify arguments in the order you like, because they are recognized using their types. The only rule to follow is that the message string must appear before the title string (if specified).
The alert(), error(), confirm(), inputbox() and msgbox() functions all accept a callback, which have the following signature :
Where status depends on the user action : it is usually a boolean set to true if the user clicked the Ok button and false if the user clicked the Cancel button or the Close icon ; dialog is a reference to the opened dialog object.
All msgbox functions accept an options object, which are simply options passed to the jQuery dialog() function.
Once closed, the displayed message boxes are removed from the DOM.
$.alert ( msg, title, callback, options )
Displays an alert message (simple message box). The parameters are the following :
The status parameter of the callback function is always set to true.
The options parameter can now contain a buttons member, which allows you to specify additional buttons to your alert box ; each element will be added to the left of the Ok button and can contain the following members :
$.error ( msg, title, callback, options )
Displays an error message (simple message box). The parameters are the following :
The difference with $.alert() resides only in the class names used for styling. The status parameter of the callback function is always set to true.
As for $.alert, additional buttons may be specified with the options parameter.
$.inputbox ( msg, title, callback, options, field_definition )
Asks the user for text input. The parameters are the following :
Note that you do not need to define an id or name attribute. This parameter is optional.
The status parameter of the callback function is set to the input string if the user clicked Ok, or false if the user clicked on the Cancel button or Close icon.
This function is used to display a modal dialog with no buttons and no possibility to be closed. You can use it to display a message while doing some long processing.
It can be displayed using one of the following forms :
$.wait ( message )
$.wait ( options )
message is the message to be displayed. options is an object than can contain any $.dialog() options, plus the following specific members :
To close the wait dialog box, simply call $.wait() with no parameters.
$.msgbox ( msg, title, callback, flags, options )
The $.msgbox() functions mimics the Windows API MessageBox function. It accepts an additional flags parameter, which is a combination of the following bit constants :
The default button, in the button set defined by the above constants, can be set to one of the following values :
The following flags allow to specify an additional icon to be displayed :
The status parameter of the callback function will be set to one of the following constants, representing the button the user clicked :
The following specific classes are added to dialog box items :
Each of these classes have also a counterpart depending on the function you are calling. For example, the $.alert() function will add a 'ui-alert-dialog-button' class for items that have class 'ui-popup-dialog-button'. $.error() will add ui-error-dialog-button-class, and so on for all the '\-popup\-' classes defined.