I have a list of messages where I bind the template of these message into a click event then inside of this template I have a hyperlink bind to js function that should open a mailto page.
But clicking this link doesn't open the page although the js function executes and if I right click "go to this address" it works. I tried many KO methods as "clickBubble: false" the "controlsDescendantBindings" flag set to true, "e.stopImmediatePropagation()". But all failed!
Here is a part of my code:
(the Partial View)
<div data-bind="template: { name: 'messageTemplate', foreach: OldMessageCollection}">
...
</div>
(the template: messageTemplate)
<div class="message_listed" data-bind="click: $root.GetSelectedMessage">
...
<ul class="actions_list">
<li><a data-bind="attr: { href: $root.mailToLink(ReplyTo())}"></a></li>
...
</ul>
</div>
ReplyTo() is an observable in KO and OldMessageCollection is observableArray.
it is solved using
<a data-bind="attr: { href: $root.mailToLink()}, click: function() {return true;}, clickBubble: false">ReplyTo</a>