Question

I want to bind the value of a button to my blank viewmodel, how would i do it? I made this fiddle to demonstrate what I ham trying to achieve.

Here is my Viewmodel:

var CustomerSearchViewModel = {
    SearchType: ko.observable(""),
    SearchString: ko.observable("");
}

$(document).ready(function () {
    ko.applyBindings(CustomerSearchViewModel);
});

Here is how I am trying to do the data-bind:

<button type="button" data-bind='value: SearchType, valueUpdate: "afterkeydown"' value="0" class="btn" data-toggle="button">Company Name</button>

Answer 1

There are multiple ways to solve this but the way how you try to use the value binding with the buttons won’t work.

One of the easiest solutions which requires the least modification in your HTML is to use the click binding and set the SearchType in the event handler:

var CustomerSearchViewModel = {
       SearchType: ko.observable(""),
       SearchString: ko.observable(""),
       setSearchType : function(data, element)
       {           
           this.SearchType($(element.target).val());
       }
   };

Then your buttons should look like this:

<button type="button" data-bind='click: setSearchType'
        value="0" class="btn" data-toggle="button">Company Name</button>

Demo JSFiddle.