• Choose a category
• All
• Classic-Fiction

By Root 769 0

of a Dialog object that can easily be used to display pop-up dialogs with a confirm button (Figure 7-3):

var myDialog = new Dialog(Dialog.DIALOG_POP);

// Show the dialog with only a confirm button

myDialog.showMessage('Title Here', 'Text Here', button_confirm='Okay!');

Figure 7-3. Simple dialog

If you’d like to have the confirm button do something other than just hiding the dialog, you can set an event handler for it before you call showMessage():

myDialog.onconfirm = eventHandlerName;

Your event-handler function can do whatever processing you’d like and should return true to hide the dialog (e.g., you have validated some input in the dialog) or false to leave it open (e.g., the input didn’t validate and the user needs to re-enter it). If you are asking for input, you probably want to add a cancel button (Figure 7-4):

var myDialog = new Dialog(Dialog.DIALOG_POP);

myDialog.onconfirm = handleConfirm;

myDialog.oncancel = handleCancel;

myDialog.showChoice('Title','Body',button_confirm='Okay!', button_cancel='No!');

Figure 7-4. Dialog with confirm and cancel buttons

Discussion

As mentioned in the Solution, the showMessage() form of dialog is a useful replacement for the traditional JavaScript function alert(). The showChoice() version is a little more useful in that you can ask users simple yes-or-no questions (“Are you sure you want to put the chocolate in the peanut butter?”), but what if you need to ask them something with more than two possible answers? Luckily for you (and for ice cream lovers everywhere), you can pass an as the text parameter in the call to showChoice() and use it to render a much more complex query:

What's your favorite ice cream flavor?

(Pick a flavor!)

Chocolate

Vanilla

Strawberry

Moose Tracks

That should give you a dialog something like Figure 7-5.

Figure 7-5. Dialog with an embedded

Displaying Contextual Dialogs

Problem

I want to display a nifty contextual dialog that points to one of my DOM objects.

Solution

Contextual dialogs are really a variation of the pop-up dialog covered in Displaying Pop-Up Dialogs, so take a moment to read that recipe first. The main differences are in your call to the Dialog() constructor and in the call to setContext(), which establishes which DOM object the dialog should point to (see Figure 7-6):

var myDialog = new Dialog(Dialog.DIALOG_CONTEXTUAL);

myDialog.setContext(document.getElementById('attachToMe'));

myDialog.showMessage('Look at Me!', 'Check this out!', button_confirm='Cool!');

Figure 7-6. Contextual dialog

Discussion

All of the same tidbits that apply to pop ups apply to contextual dialogs as well, including the ability to set up an for use as the body:

Hi firstnameonly="true"

linked="false"

useyou="false"/>!