JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.aspnetcdn.com/ajax/knockout/knockout-3.0.0.js"></script>
<div class="itemLabel">Chargeable (Yes/No):</div>
                <select data-bind="    value: chargeable, disable: chargeable.isServerSet">
                    <option value=""></option>
                    <option value="Y">Yes</option>
                    <option value="N">No</option>
                </select>

<input type="button" id="updateDropdown" value="Update Dropdown" /><br /><br />
<input type="button" id="saveButton" class="bigButton" value="Save" /><br />

CSS

.itemLabel {
    clear: both;
    float: left;
}

JavaScript

ko.applyBindings(new viewModel());

function viewModel(){
    var self = this;
    
    self.chargeable = ko.observable();
    self.chargeable = ko.observable().extend({
        isServerSet: false
    });
    
    $('#updateDropdown').click(function() {
        console.log('updating to: ' + obj.Chargeable);
      self.chargeable(obj.Chargeable);
    });
    
    $('#saveButton').click(function() {
        console.log(self.chargeable());
        if(self.chargeable()){
            console.log('fail');
        }  else {
            console.log('success');
        }            
    });

}


var obj = {Chargeable: null};