DataFlex Web Framework Symposium – Part 7.5

Web Framework Modal Objects

John TuohyDevelopment Team

www.dataaccess.com

Modal Objects

• The web framework supports Modal objects• Supports:

– Message Boxes– Modal Dialogs

• We provide the classes and interface to make this all work

• There are special web considerations

Handling Events

• The client/server event cycle– The client

• Generates an event. If a server event it sends a request to the server

– The server• Attaches process and synchronizes• Sends the event to the corresponding DataFlex object

– Which, might change web property values and queue client actions• Generates a response and detaches from the process

– The client• Handles the response by synchronizing web properties and

executing required client actions

Modal Objects

// Create a Hello World ButtonObject oButton is a cWebButton Set psCaption to “Save" Procedure OnClick Send ShowInfoBox of oWebApp "Hello world!"

End_ProcedureEnd_Object

5

Modal Objects

Modality using a windows-like approachObject oButton is a cWebButton Procedure OnClick Integer eConfirmMode // invoke modal dialog which asks question Get ShowYesNo of oWebApp "Are you sure?" "Confirmation" to eConfirmMode // handle the response If (eConfirmMode =MBR_Yes) Begin Send DoAction End End_ProcedureEnd_Object

This will not work, can you see why?

• User interface event

• Send AJAX Call

JavaScript Engine

• Synchronize state• Event procedure• Generate

response

WebApp • Update web properties

• Display errors• Perform client

actions

JavaScript Engine

Handling Events

Modal Objects

• With web modal dialogs you are going to need an extra client-server round trip

1. OnClick request is sent to server2. Server tells client to display the modal dialog and disconnects3. Upon completion client must send a message back to the server with

the results4. The Server processes the results and disconnects

Q: How does the client know what message and object to callback in step 3?

A: A callback object and message must be passed in step 2.

Modal ObjectsModality using the web approach – this worksObject oButton is a cWebButton Procedure ConfirmResponse Integer eConfirmMode If (eConfirmMode = cmYes) Begin Send DoAction End End_Procedure

// Publish the response method WebPublishProcedure ConfirmResponse

Procedure OnClick Integer eAnswer Send ShowYesNo of oWebApp (Self) (RefProc(ConfirmResponse) "Are you sure?"

"Confirmation" End_ProcedureEnd_Object

Modal Objects

• Message Boxes– ShowInfoBox

• Used to show an information box• Single Ok button, no callback

– ShowYes • Used to show a Yes/No dialog• You pass the callback object and callback message

– ShowMessageBox• Used or custom multi-button message boxes• You pass the callback object and callback message

Modal Objects• Modal Dialogs

– Based on cWebModalDialog class– Is invoked by sending Popup passing the callback object– Upon completion the client sends a server requests which sends

OnCloseModalDialog to the callback object

Procedure OnCloseModalDialog Handle hoModalDialog String sAnswer Get GetAnswerName of hoModalDialog to sAnswer Send ShowInfoBox ("Your name is " + sAnswer) End_Procedure

Procedure OnClick Send InitializeDialog of oDemoQuestionDialog "Question" "What is your name?" Send Popup of oDemoQuestionDialog Self End_Procedure

Modal DialogsThe Invoking Object

Object oAskQuestion is a cWebButton

Set psCaption to "Ask Name"

Procedure OnCloseModalDialog Handle hoModalDialog

String sAnswer Get GetAnswers of hoModalDialog to

sAnswer Send ShowInfoBox ("Your name =" +

sAnswer) End_Procedure

Procedure OnClick Send InitializeDialog of

oDemoQuestionDialog "What is your name?" Send Popup of oDemoQuestionDialog Self End_Procedure

The Modal Dialog

Object oDemoQuestionDialog is a cWebModalDialog

// user inteface goes here Function GetAnswers Returns String String sReponse WebGet psValue of oResponseFrm to

sResponse Function_Return sReponse End_Function

Procedure InitializeDialog String sQuestion WebSet psCaption of oQuestionLbl to

sQuestion WebSet psValue of oResponseFrm to "" End_ProcedureEnd_Object

Modal Objects

• To summarize– The web framework support modal popup objects by

using callbacks– Supports:

• Message Boxes• Modal Dialogs

– An extra request/response cycle is required– A callback mechanism is required to make this work– Special interfaces are provided to make the callback

mechanism easy to use and secure

The End