In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > event handling > properties > lastEventId (event)

lastEventId property (event)

Browser support:

	3	10.6

Returns the identifier of the last event in case of onmessage events.

Note: The lastEventId property is supported in Firefox from version 3 and in Opera from version 10.6.

An onmessage event occurs when the postMessage method sends a message to the current window. The lastEventId property is not filled by the postMessage method.

If you want to set the lastEventId property, then create an event object with the createEvent method with a type of 'MessageEvent', initialize it with the initMessageEvent method and dispatch it with the dispatchEvent method.

For further details, see the pages for the postMessage method and the onmessage event.

Syntax:

object.lastEventId;

You can find the related objects in the Supported by objects section below.

This property is read-only.

Possible values:

String that retrieves the identifier of the last event.

Default: this property has no default value.

Example HTML code 1:

This example illustrates the use of the lastEventId property:

Code

message.htm

<head>
    <script type="text/javascript">
        function Init () {
            if (window.addEventListener) {
                window.addEventListener ("message", OnMessage, false);
            }
        }

        function GetState () {
            if (document.createEvent) {
                var frame = document.getElementById ("myFrame");

                    // send the 'getstate' message to the frame window
                    // use the dispatchEvent instead of the postMessage method
                var messageEvent = null;
                try {
                    messageEvent = document.createEvent('MessageEvent');
                }
                catch (e) {
                    alert ("Your browser does not support the createEvent method for the MessageEvent event type!");
                    return;
                }

                var message = "getstate";
                var origin = window.location.protocol + "//" + window.location.host;
                var lastEventId = 12;
                if (messageEvent.initMessageEvent) {
                    messageEvent.initMessageEvent ("message", true, true, message, origin, lastEventId, window, null);
                    frame.contentWindow.dispatchEvent (messageEvent);
                }
                else {
                    alert ("Your browser does not support the initMessageEvent method!");
                }
            }
            else {
                alert ("Your browser does not support the createEvent method!");
            }
        }

        function OnMessage (event) {
            var message = event.data;
            var arr = message.split (",");
            if (arr[0] == "true") {
                alert ("The check box is checked.");
            }
            else {
                alert ("The check box is not checked.");
            }

            var selIndex = Number (arr[1]);
            alert ("The " + (selIndex + 1) + ". option is selected.");
        }
    </script>
</head>
<body onload="Init ();">
    <iframe id="myFrame" src="message.htm" width="500" height="200px"></iframe>
    <br /><br />
    <button onclick="GetState ()">Get the state of controls in the frame</button>
</body>

<!DOCTYPE html>
<html>
<head>
    <title>Message handling example</title>
    <meta charset="utf-8" />
    <script type="text/javascript">
        function Init () {
            if (window.addEventListener) {  // all browsers except IE before version 9
                window.addEventListener ("message", OnMessage, false);
            }
            else {
                if (window.attachEvent) {   // IE before version 9
                    window.attachEvent("onmessage", OnMessage);     // Internet Explorer from version 8
                }
            }
        }

        function OnMessage (event) {
                // Check the location of the caller
            
                // Opera earlier than version 10
            if ('domain' in event) {
                if (event.domain != "help.dottoro.com") {
                    return;
                }
            }
                // Firefox, Safari, Google Chrome, Internet Explorer from version 8 and Opera from version 10
            if ('origin' in event) {
                if (event.origin != "http://help.dottoro.com") {
                    return;
                }
            }
            
            DumpMessageInfo (event);
            
            if (event.data == "getstate") {
                    // create the message
                var checkBox = document.getElementById ("myCheck");
                var select = document.getElementById ("mySelect");
                var message = checkBox.checked + "," + select.selectedIndex;
                
                    // send back the response message
                event.source.postMessage (message, event.origin);
            }
        }
        
        function DumpMessageInfo (event) {
            var info =  document.getElementById ("info");
            info.innerHTML = "message: " + event.data;
                // Opera earlier than version 10
            if ('domain' in event) {
                info.innerHTML += "<br />domain: " + event.domain;
            }
                // Opera earlier than version 10
            if ('uri' in event) {
                info.innerHTML += "<br />url: " + event.uri;
            }
                // Firefox, Safari, Google Chrome, Internet Explorer from version 8 and Opera from version 10
            if ('origin' in event) {
                info.innerHTML += "<br />origin: " + event.origin;
            }
                // Firefox, Safari and Google Chrome
            if ('lastEventId' in event) {
                info.innerHTML += "<br />lastEventId: " + event.lastEventId;
            }
        }

    </script>
<body onload="Init ();" style=background-color:#e0b0a0;>
    <input type="checkbox" id="myCheck" />Sample check box<br />
    <select id="mySelect">
        <option>First option</option>
        <option>Second option</option>
        <option>Third option</option>
    </select>
    <br /><br />
    Information about the message:
    <div id="info" style="background-color:#f0f0b0;"></div>
</body>
</html>