Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Disable anchor tag in knockout.js

Tags:

I need to disable the anchor tag inside a foreach loop of knockout.js in HTML.

Here is my code:

<a id="aQStreamSkype" data-bind="attr:{href: ''}, click: $parent.StoreUserClick,disable: ($data.SkypeId == 'null')">Skype </a> 
like image 273
akeeseth Avatar asked Apr 12 '13 10:04

akeeseth


People also ask

How to disable anchor tag in Knockout js?

Anchor tags cannot be disabled. If there is no href attribute on a element but only an action in a click binding , then an easy way would be passing expression condition && handler to a click binding. If condition is observable you'll need to add parentheses.

What is applyBindings in Knockout?

A binding context is an object that holds data that you can reference from your bindings. While applying bindings, Knockout automatically creates and manages a hierarchy of binding contexts. The root level of the hierarchy refers to the viewModel parameter you supplied to ko. applyBindings(viewModel) .

How do we activate a Knockout model?

To activate Knockout, add the following line to a <script> block: ko. applyBindings(myViewModel); You can either put the script block at the bottom of your HTML document, or you can put it at the top and wrap the contents in a DOM-ready handler such as jQuery's $ function.


1 Answers

Anchor tags cannot be disabled.
The easiest is to use ko if binding and then render a span instead of the anchor if the skype id is null

<!-- ko if: skypeId === null -->     <span >No Skype Id</span> <!-- /ko --> <!-- ko if: skypeId !== null -->     <a id="aQStreamSkype" data-bind="attr:{href: ''}, click: $parent.StoreUserClick,text: skypeId"></a> <!-- /ko --> 

Here is a fiddle

like image 92
Sujesh Arukil Avatar answered Sep 23 '22 21:09

Sujesh Arukil