Web 2.0 Message Dialog and Web Dialog Title Style

I really like the addition of the Message Dialog to Web 2.0 so I no longer have to roll my own like in Web 1.0. However I’d like to be able to set a bootstrap style for the Title. Does anyone know if that is that possible?

As for the WebDialog I think the the documentation is incorrect. It lists a title property but there is no title property available. I think this may still be Web 1.0 documentation or the feature did not get implemented. In any case it really should have a Title property and I would like to also to be able to set a bootstrap style for the WebDialog Title too.

Tom, please submit a bug report about that.

Is there a sample on how to use MessageDialog for web?

The Documentation was all I could find but it was easy to follow.

I can’t able to run the sample from the online documentation

It looks like you’re trying to use the example from the Desktop version of MessageDialog. You should look at the documentation for WebMessageDialog. Although an example is missing from the docs, I just whipped up an example for you.

I created a PushButton on my WebPage, and in the Pressed event, I added the following code:

Var d As New WebMessageDialog                  // declare the MessageDialog object
d.ActionButton.Caption = "Save"
d.CancelButton.Visible = True               // show the Cancel button
d.AlternateActionButton.Visible = True      // show the "Don't Save" button
d.AlternateActionButton.Caption = "Don't Save"
d.Message = "Do you want to save changes to this document before closing?"
d.Explanation = "If you don't save, your changes will be lost. "

AddHandler d.ButtonPressed, WeakAddressOf dialogButtonPressed

d.Show                            // display the dialog

You’ll notice this is very similar to the Desktop code, but there’s no code to handle which button is clicked. Instead, we have an AddHandler line which will call the dialogButtonPressed method. Here’s the definition for that method:

Private Sub dialogButtonPressed(sender as WebMessageDialog, button as WebMessageDialogButton)
  Select Case button                               // determine which button was pressed.
  Case sender.ActionButton
    // user pressed Save
    button1.Caption = "Saved!"
  Case sender.AlternateActionButton
    // user pressed Don't Save
    button1.Caption = "Unsaved!"
  Case sender.CancelButton
    // user pressed Cancel
    button1.Caption = "Canceled!"
  End Select
End Sub

Upon running this example, clicking the button shows the WebMessageDialog. When you click one of the WebMessageDialogButtons, the dialog is dismissed and the caption of the button is changed based on the selection.

The easiest way, however, is to add a “Message Dialog” to your page from the Library and implement the ButtonPressed event there.

2 Likes

FYI, to get a correctly formatted method for the AddHandler call, you can right-click on the class(WebMessageDialog) and select Add Method > From Event > EventName. The IDE will insert a method in the current object with an appropriate name, in this case:

WebMessageDialog_Pressed(obj as WebMessageDialog, button as WebMessageDialogButton)

4 Likes

Thanks Anthony!

It made it work.

Beautiful!

Btw, as you know, I am Graffitisuite #1 fans for Web 1.0. However looks like some of the components offered in the Graffitisuite Web are already provided by XOJO Web 2.0.

What is the future plan for Graffitisuite?

I will message you directly about GraffitiSuite so as to not derail the topic.