View source for Set Web Property with a Client-Side event


This is a topic based on a forum post (archiving it here so that it is easier to find back)

[https://support.dataaccess.com/Forums/showthread.php?65621-Set-Web-Property-with-Javascript Set Web Property with Javascript]

Harm's example code:

<source lang="dataflex">
Object oMyForm is a cWebForm
    { WebProperty=Client }
    Property Integer piFocusCount 0
    
    Set psClientOnFocus to "window.OnFocusIncrementCount"
    Set piColumnSpan to 12
    Set psLabel to "Counts focus:"
    
End_Object

Object oMyButton is a cWebButton
    Set piColumnSpan to 0
    Set psCaption to "button"

    Procedure OnClick
        Integer iCount
        
        WebGet piFocusCount of oMyForm to iCount
        
        Send ShowInfoBox (SFormat("Form was focussed %1 times!", iCount))
    End_Procedure
End_Object
</source>

And the OnFocusIncrementCount JavaScript implementation:

<source lang="javascript">
function OnFocusIncrementCount(oEvent){
    var oMyForm = oEvent.oSource;
    var iCount = oMyForm.get("piFocusCount");
    iCount++;
    oMyForm.set("piFocusCount", iCount);
}
</source>

With the psClient.. event handlers you can define your functions globally (like in the example above) or locally on the object or subclass. If the event is defined globally then this will refer to the object on which the function is defined (in this case window). But the event always gets an event object as parameter with several properties including the source object of the event (oSource). So in the example above oSource points to the JavaScript version of oMyForm. Web properties can be accessed directly, but better is to use the get and set functions. The set function will make the property synchronized (so that is value is sent to the server) and both functions can take care of type conversions. 

    Harm Wibier
    Data Access Europe B.V.
    http://www.dataaccess.eu/

[[Category:Web Applications]]