I would like to auto suppress click events when the link href is a hash (#). I don't want to have to stop the event with e.preventDefault() within each view.
How can you stop click events application wide for # hrefs?
Interesting question. The backbone routing gets fired before the default behavior, obviously. What you would have to do is insert an event handler that gets fired between the backbone routing and the default behavior, and then e.preventDefault().
I believe that the order of execution of event handlers depends on the order in which they are defined. So play around with that somewhat. You can use the following to inspect the array of event handlers: $(window).data('events'); (I'm assuming you're using jQuery?)
Related
There is a duplicate for each event on react audio and video tags, for example it has onCanPlayThrough property and onCanPlayThroughCapture as well. Behaviour for both of them in the browser is completely the same.
Do we need to use ...Capture events instead of standard events? What is the main idea for them? Where can I find information about them.
This is covered in the React documentation here, though it's easy to miss:
The event handlers below are triggered by an event in the bubbling phase. To register an event handler for the capture phase, append Capture to the event name; for example, instead of using onClick, you would use onClickCapture to handle the click event in the capture phase.
DOM events have multiple phases (see diagram below), which are (in order):
Capture
Target
Bubbling
Normally we use target or bubbling (addEventListener's false third param [the default]), but there are rare occasions where you want to hook into the capture phase instead (third param = true). The ...Capture handlers let you do that.
They are not the same and the documentation also states this:
The event handlers below are triggered by an event in the bubbling phase. To register an event handler for the capture phase, append Capture to the event name; for example, instead of using onClick, you would use onClickCapture to handle the click event in the capture phase.
The effect is the same as in regular DOM bubbling/capturing. If you want to capture, the event will fire on a parent first. On bubbling it will fire on the actual element first and then bubble to parents.
This may not be a Mithril specific question but VM DOM diffing in general. While "redrawing" a page and you attach a new event handler, remove an event handler, or change the event handler associated with an event such as "onclick", it seems that the VM DOM diffing will not detect the change and I have to explicitly force a rerendering of the "real" DOM.
Is there a good pattern to handle these situations.
In Mithril specifically, onclick and all the on-handlers automatically trigger a redraw after the handler function has completed. However, if your onclick handler does real DOM manipulation (3rd party libraries such as jQuery or an animation suite) you need to use the config attribute:
http://lhorie.github.io/mithril/mithril.html#the-config-attribute
which gets called after the page has been rendered.
With regards to changing event handlers, it depends on when in the render cycle you make the change. I'd have to see some code. If it's not too inconvenient, calling redraw manually is not a bad thing. If the redraw strategy is "diff" you won't pay a penalty.
And lastly, if you are introducing your own events, consider using m.startComputation/m.endComputation in your event handlers. These provide much finer grain control and a redraw is automatically called.
http://lhorie.github.io/mithril/mithril.computation.html
I have a view where i have 3 links(routers which have methods triggering a View bound event).
Normally based on the link i click i reduce from the main collection a subset and render it in another VIEW.
But suppose i have clicked on a link say '....#/remaining' and then i click again on the same link, the event bound is not triggered.
But when i click on any other link and click back on the desired link, everything works!
Is this a Backbone feature/defect, if so what are the alternatives to work around this?
Thanks in Advance.
I think this is because you're doing the reduce in the Router. When you're already on #remaining, your route handler won't execute because there's no route change at all.
Instead of that, you could use a View UI event on the link to manipulate the collection, so it will always be called no matter if you're already on that route or not.
You could also use events as a communication method between your app's components: your data, your views, and so on.
Hope it helps, I didn't put any code because you didn't either. :)
I saw that it adds events to an Observable. However, you would only add it if you would fire it at some point. So, if you add the firing of the event at some line in your code, it was useless to put it into addEvents in the first place and when you don't place the fireEvent in your code then it was pointless to include it in addEvents. What am I missing?
If you are adding custom events with your component then you must add the events with addEvent before you can fire the events with fireEvent. Adding and firing events is useful in binding custom components together without explicitly referencing them.
In my surface application I have a SurfaceWindow with a SurfaceUserControl on. On the SurfaceUserControl I have a SurfaceButton but the ContactUp (and down) event is not fired. The ContactHoldGesture event is fired though.
Any ideas?
Could you include some code to reproduce? Where are you subscribing to those events?
Most likely what's happening is the contact up and down events are being handled by the button, so they don't fire at the usercontrol level. Try looking at the previewcontactup and previewcontactdown events.
ContactUp and ContactDown are handled by the button itself - that's why the events never get to your code. If you really want to intercept these events, use PreviewContactUp/PreviewContactDown instead. What you probably really need though is to just handle the Click event on the button. Adjust the ClickMode property of the button if you want to change what causes the Click event to be raised.