How to create a message window?

DHTMLX Touch simplified creating alert, confirm and notice messages by means of 3 commands: dhx.alert(), dhx.confirm() and dhx.notice().

Please note, created alert(confirm) windows:

  • Not modal (don't prevent the workflow on the application parent window)
  • Exist in the only copy (when a new alert(confirm) window appears - the previous one disappears).

Let's know how to use them.

dhx.alert()

By calling this command you create alert window.

Parameters

  • title - (string) the text of the header
  • message - (string) the text of the window body
  • width - (integer) the width of the window
  • height - (integer) the height of the window
  • position - (right, center or left ) the alignment of the window's body text
  • details - (any)the content of the parameter is passed to callback function as the second parameter (optional).
  • callback - (function) contains code that will be called on the button click. Can get 2 parameters:
    • 'true' as the first parameter.
    • 'details' parameter as the second (optional).
dhx.alert({
		title: "Close",
		message: "You can't close this window!",
		callback: alert2
})
function alert2() {
             dhx.alert("You closed me")
}

There is the other way to call this command.

dhx.alert("AlertText");

It's analogous to the following calling statement:

dhx.alert({
		title: "Info",
		message: "AlertText",
		width: 300,// the default width value
		height: 200, // the default height value
		position: "center", // the default text alignment
		callback: ""
})

dhx.confirm()

By calling this command you create confirm window.

Parameters

  • title - (string) the text of the header
  • message - (string) the text of the window body
  • details - (any) the content of the parameter is passed to callback function as the second parameter (optional).
  • callback - (function) contains code that will be called on the button click. Can get 2 parameters:
    • 'true' or 'false' as the first parameter (subject to the clicked button).
    • 'details' parameter as the second (optional).
dhx.confirm({
		title: "Close",
		message: "Are you sure you want to do it?",
		callback: function(result) {
			if (result) 
				dhx.alert("You have select 'Ok'");
			else
				dhx.alert({
					message:"You have select 'Cancel'",
					callback:function(){
						dhx.confirm("Still want to try?");
					}
				});
		}
});

You also have the other way to call this command:

dhx.confirm("ConfirmText");

It's analogous to the following calling statement:

dhx.confirm({
		title: "Info",
		message: "ConfirmText",
		width: 300,// the default width value
		height: 200, // the default height value
		position: "center", // the default text alignment
		callback: ""
})

dhx.notice()

By calling this command you create notice window.

Parameters

All the parameters are optional.

  • message - (string) the text of the window body
  • css - (string) the name of the appropriate css class
  • width - (integer) the width of the window
  • height - (integer) the height of the window
  • delay - (integer) time delay in milliseconds.
  • top - (integer) the top offset of the text
  • right - (integer) the right offset of the text
dhx.notice({
		message: "Sorry, an error has occured!",
		css:"error",
		delay:2000
})

There is the other way to call this command.

dhx.notice("Trial version");

It's analogous to the following calling statement:

dhx.alert({
		message: "Trial version",
                css:"",
		width: 160,// the default width value
		height: 60, // the default height value,
                delay:3500, // the default time delay
		top: 9, // the default top offset of the text
		right: 9 // the default right offset of the text
})