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>
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.
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) .
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.
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
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With