You are here: Reference > JavaScript > client-side > event handling > events > onbeforeupdate

onbeforeupdate event | beforeupdate event

Browser support:
Occurs on a databound object before it updates the data in the data source object.
If the contents of a databound object are modified and the databound object loses the active state, then the associated data in the data source object is updated. In that case, the onbeforeupdate event is fired before and the onafterupdate event is fired after the update process. If an error occurs while updating, the onerrorupdate event is fired instead of the onafterupdate event.
These events occur on the databound object. If you need an event that occurs on the data source object when its data has changed, use the oncellchange event.
For further details about data source objects, see the page for the recordset object.

How to register:

In HTML:
<ELEMENT onbeforeupdate="handler">

In JavaScript:
object.onbeforeupdate = handler;
object.attachEvent ("onbeforeupdate", handler);
You can find the related objects in the Supported by objects section below.
The event object is accessible to all event handlers in all browsers. The properties of the event object contain additional information about the current event. To get further details about these properties and the possible event handler registration methods, please see the page for the event object.
For a complete list of events, see the page for Events in JavaScript.

Basic information:

Bubbles Yes
Cancelable Yes
Event object -

Actions that invoke the onbeforeupdate event:

  • If the contents of a databound object are modified and the databound object loses the active state.

The order of events related to the onbeforeupdate event:

The onbeforeupdate event always occurs before the onafterupdate or onerrorupdate event.

Example HTML code 1:

This example illustrates the use of the onbeforeupdate event:
<head>
    <script type="text/javascript">
        function OnBeforeUpdate () {
            alert ("The data source object will be updated.");
        }
        function OnErrorUpdate () {
            alert ("There was en error while updating the data source object!");
        }
        function OnAfterUpdate () {
            alert ("The data source object has been successfully updated.");
        }
    </script>
</head>
<body>
    <xml id="movies">
    <?xml version="1.0"?>
        <movies>
            <movie>
                <name>Clark Kent</name>
                <jobtitle>Superman</jobtitle>
                <born>1966</born>
            </movie>
            <movie>
                <name>Lois Lane</name>
                <jobtitle>Reporter</jobtitle>
                <born>1964</born>
            </movie>
        </movies>
    </xml>

    Modify the contents of the following input fields then click anywhere on the page.
    <br /><br />
    <table width="100%" cellpadding="0px" cellspacing="2px" border="1px" datasrc="#movies" datapagesize="2" 
            onbeforeupdate="OnBeforeUpdate ();" onerrorupdate="OnErrorUpdate ();" onafterupdate="OnAfterUpdate ();">
        
        <thead>
            <tr>
                <th>Name</th>
                <th>Jobtitle</th>
                <th>Born</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td><input datafld="name" /></td>
                <td><input datafld="jobtitle" /></td>
                <td><input datafld="born" /></td>
            </tr>
        </tbody>
    </table>
</body>
Did you find this example helpful? yes no

Supported by objects:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content