browser javascript creating custom events

Question

I don't unterstand this:

I try to create a custom event which should be fired when a list is fully loaded in a table body. Like this (executes after list is loaded):

  var event = new Event('mklistloaded', {
        name: 'listname'
  });

  document.dispatchEvent(event);

And this is the "receiving" end:

document.addEventListener('mklistloaded', function(e) {

    console.log('mklistloaded event: ' + JSON.stringify(e));

});

But console log prints out:

mklistloaded event: {"isTrusted":false}

That's quite the same as described in the mozilla example:

https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Creating_and_triggering_events

What am I doing wrong here?

charlietfl · Accepted Answer · 2016-05-29 17:42:05Z

1

You missed the section in the docs "Adding custom data – CustomEvent()"

document.addEventListener('mklistloaded', function(e) {
  console.log('mklistloaded detail: ', e.detail);
});
// use CustomEvent() instead of Event()
var event = new CustomEvent('mklistloaded', {
  'detail': 'listname'
});

document.dispatchEvent(event);

Note that it seems to require using the property name detail

answered May 29, 2016 at 17:42

charlietfl

172k14 gold badges125 silver badges154 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

browser javascript creating custom events

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related