CODEWITHSUNDEEP
javascripthtmlknockout.js
Shawn Cooke
Shawn Cooke

Reputation: 967

Knockout JS visible based on select value

I am trying to show or hide a paragraph based on the value of a select. I have reviewed the various posts that seem the same as my question however, I am new to knockout.js and none of them seem to give a basic simple example of what I am trying to do.

Here is the fiddle: http://jsfiddle.net/scooke/ub8ozbvf/

Upvotes: 1

Views: 973

Answers (2)

ybrajim
ybrajim

Reputation: 112

You have some mistakes on your code:

  1. Javascript: on json objects, the key-value pairs are separated by comma not by semicolons 

    var testing = {
  currentSelect: ko.observable("apples"),
  otherKey: ko.observable("otherValue"),
}

  2. HTML data-bind tags: as you are using a ko.observable to test equality, you have to call it as a function and you don't have to break the simple quotation mark inside double quotation mark

<p data-bind="visible:currentSelect() === 'apples'">Apples Shown!</p>

I've update your fiddle

Upvotes: 1

lem2802
lem2802

Reputation: 1162

you can use the ko if comment.

in your case:

<!-- ko if: multipleSelectedOptionValues() == "Alpha" -->
        <p>show or hide</p>
<!-- /ko -->

Upvotes: 1

Related Questions