Vikash Vikash - 1 month ago 12
Javascript Question

KnockoutJS data-bind="Visible :" with two conditions is not working

A simple thing I am trying to workout with KnockoutJS.

I have two

dropdowns
and a
textbox
.

What I need

If both the dropdowns are selected, then only I should get the checkbox displayed. Otherwise, the text input should not visible.

What I tried:

Here is my fiddle: https://jsfiddle.net/vikash208/z4x5meua/13/

I used something like this:

data-bind="visible: selectedValue && selectedControl"


From the above, the conditions are verified as below:

IF selectedValue IS TRUE AND selectedControl IS NOT UNDEFINED


Kindly provide me a solution and also where I went wrong with it. I am a beginner of
knockoutJS

Answer

When you use multiple conditions in a binding, you need to unwrap the observables so the entire expression can be evaluated.

To do this, just add brackets after the observable:

<input type="text" class="form-control" data-bind="visible: selectedValue() && selectedControl()" />

JSFiddle