knockoutjs datalist

knockout class binding

by andrew rowe

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.5.1/knockout-latest.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<h1 data-bind="text: value">
</h1>
<input type="text" data-bind="textInput: value" list="groups">

<datalist id="groups">
<option>one</option>
<option>two</option>
<option>three</option>
</datalist>

CSS

.red {
  background: red;
}

.yellow {
  color: yellow;
}

JavaScript

//let value = 'hello';

class ViewModel {
  constructor() {
    this.value = ko.observable('hello');
  }
}
vm = new ViewModel();
ko.applyBindings(vm);