I'm looking a way to handle any mouse down event within an highchart/highstock graph. Currently I'm using the custom-events plugin but it doesn't offer this event on the chart object.
What will be the proper way to handle this event on the chart part?
Thanks,
Manu
You can set onmousedown event attribute in container div. You could also use jQuery events.
Examples:
http://jsfiddle.net/5Lu4at1s/ - with event attribute
http://jsfiddle.net/bLtqp24d/ - using jQuery mousedown event
Related
I am using jQuery-ui autocomplete, and I am tyring to handle the event that is fired each time the user moves up and down through the list of results by using the up and down keyboard arrow keys (not when using mouse).
Is that possible? if so, how?
I have solved it by handle focus event for this case and then I ignore default behaviour by returing false (sames as event.preventdefault()).
I have a React component with an onClick handler.
The component is made of several subcomponents, including one that renders a Highcharts chart.
If I click anywhere on my component OTHER than on the Hichcharts view, the onClick is triggered as expected. If I click on the chart, the onClick is not triggered.
How can I fix this?
The cleanest solution for me was to render a transparent div overtop of the highchart using absolute positioning.
The transparent div gets the events first and is handled purely by React. This solves all problems.
I am trying to add custom behavior to a TExpander. Basically what I am trying to acheive is the following:
I've got multiple TExpanders on my form. When the user expands one of these TExpanders, all the other TExpanders should be minimized.
The easiest way to do this is to handle the OnResize event for the TExpander, and then in that event, check the IsExpanded property of each of the other TExpander panels and set them to False.
By default, the tooltip appears as soon as the cursor enters the chart. I would like to control when it first appears in one of two ways:
Wait for user to hover over (around) a data point on the chart.
This way the user can look at the entire chart without the
distraction of the tooltip.
mousedown - is there a way to disable the default mousedown function
and use it for displaying the tooltip instead? And because the
tooltip and crosshair seem to be joined, perhaps the same mousedown
event could fire the crosshair to appear?
number 2 would be best; any suggestions/solutions would be appreciated!
Number 2 is possible to achieve by:
disable default Highcharts tooltip
create point.click event handler
in above handler, create your own tooltip (it's simple div with some CSS)
make proper position for tooltip (accessed via this.point.plotX and this.point.plotY
I'm using jQueryUI Accordion, and genereate the elements on the fly. I need to prevent accordion expanding if we click Remove action link inside the header.
To stop further handlers from executing after one bound using .live(), the handler must return false. Calling .stopPropagation() will not accomplish this.
No luck with return false. Please see the demo.
I don't think you will have too much luck achieving what you want with live(), as jQuery only supports event bubbling and not event capturing. The design decision was probably due to the fact the IE does not support event capturing, even though W3C's speicification has the flexibility for both.
Your best bet is to attach a click event to the remove button right after it is inserted into the DOM (to stop the event propagation) before you re-initiate the accordion. You may need to take care not to bind click event to the existing remove buttons multiple times.
The pseudocode would look something like this:
call .accordion('destory') on the current accordion
create the new element, i.e. <h2>...<a class="revmoe">...</a></h2><div>...</div>
insert the new element to the existing accordion
bind a click event to the remove button in the new element to stop event propagation
initiate the accordion, i.e. .accordion({..})
SO posts on event capturing in jQuery:
event capturing with jQuery
Event Capturing vs Event Bubbling
Just use the given functions by the plugin:
$('#accordion').accordion({active:8, disabled:true});
jQuery('.remove').click(function(){
$('#accordion').accordion('disable');
})
I chose the option "active:8" because this way no header is opened from the beginning (index -1 does not work for IE). Check the function and options out at: http://docs.jquery.com/UI/Accordion
Hope this is what you were looking for :-)