knockout.js - KnockoutJS: Checkbox Inside Click-Bound Anchor-Tag not Selectable -

i trying bind checked on checkbox input resides inside anchor tag which, itself, click bound.

whilst aware may not entirely valid (interactive content may not descendant of anchor-tags), still work intended - if understand it.

currently, outside click event handled , click never arrives @ checkbox.

an example of trying achieve here: http://jsfiddle.net/fzmppu93/2/

having had through knockoutjs documentation, tried clickbubble: true on anchor-tag's click binding - no avail.

the use case, if you're interested, unordered list containing links - each of these "links" contains information on tv show: title, actors, image, synopsis. show selectable, there 'quick-actions' mark seen, star it, , forth.

is there way of making checkbox work inside anchor-tag?

i have written custom binding handler similar "clickbubble", mines allows prevent propagation of event.

here binding handler:

ko.bindinghandlers.preventbubble = {         init: function (element, valueaccessor) {             var eventname = ko.utils.unwrapobservable(valueaccessor());             var arr = eventname;             if (!eventname.pop) {                 arr = [arr];             }             (var p in arr) {                 ko.utils.registereventhandler(element, arr[p], function (event) {                     event.cancelbubble = true;                     if (event.stoppropagation) {                         event.stoppropagation();                     }                 });             }         }     }; 

and here working fiddle of example.