In this example, the
inform instance methods of the
Uize.Widget widget base class are being used to display decorated confirm and inform dialogs. The decorated dialog windows are implemented using HTML and provide a substitute for the somewhat less than attractive dialogs provided by the browser through the built-in
alert global functions. The decorated dialogs can be styled to your Web site's choosing with a little bit of CSS. Unlike the built-in dialogs, the skinnable dialogs can also display a state icon.
Use the buttons below to launch the confirm and inform dialogs. First, click the "SHOW A DELETE CONFIRMATION" button to show the sample delete confirmation dialog. If you click either of the "DON'T DELETE" or "X" (close) buttons in this dialog, then an inform dialog is displayed to verify that you canceled the delete. If you instead click the "DELETE" button, then an inform dialog is displayed to verify that your hypothetical items were successfully deleted. The "SHOW AN INFO DIALOG" button just shows an inform dialog with a neutral info icon. This provides a glimpse of the range of decorated dialogs that can be displayed.
Worth pointing out is that you'll notice, if you look at the source code for this page, that the page does not initially source in or set up any dialog widgets. This is because the functionality is implemented in such a way that
Uize.Widget.Page page widget class, any page that uses this class, and any widget that is on the page widget's widget tree, will have access to this functionality.