Question

I’m trying to send a mousedown event as a click to google charts although have hit a road block and not sure why im getting the following error.

I’m using jQuery and google charts api, visualisationOverlay is an absolute positioned div over the top of the chart, the error is when dispatchEvent sends the modified event to the google chart iframe.

$('#visualizationOverlay').live('mousedown',function(e){
    e.type = "click";
    vis = document.getElementById($('#visualization').find('iframe').attr('id'));
    console.log(vis);
    vis.dispatchEvent(e);
});

I get the following error in firefox

NS_ERROR_ILLEGAL_VALUE: Component returned failure code: 0x80070057 (NS_ERROR_ILLEGAL_VALUE) [nsIDOMEventTarget.dispatchEvent]

Any hints where i’m going wrong would be highly appreciated!

Answer 1

You can’t trigger an event that was fired to another element. You need to create a new event or just use jQuerys trigger.

Take a look at this example. Click on the first element fires an error as the second log as expected.

$('#id1').on('mousedown', function(e){
  e.type = 'click';
  $('#id2').get(0).dispatchEvent(e);
});

$('#id2').on('mousedown', function(e){
  $('#id1').trigger('click')
});

$('#id1').on('mousedown', function(e){
  console.log('mousedown');
});

$('#id2').on('click', function(e){
  console.log('click');
});