JSFiddle - React, Tailwind, and code Playground

by mori57

HTML

<span data-bind="text: testProperty"></span><br />
  <!-- wrap the input and button in a form and
       data-bind to submit, with a reference
       to a handler on your viewmodel -->
  <form data-bind="submit: updateProfile">
    <!-- this must be bound to your shadow value -->
  <input type="text" data-bind="value: _tmpTestProperty" />
    <button type="submit">save</button>
  </form>

JavaScript

function testViewModel()
{
  var self = this;
  
  self.testProperty = ko.observable("Initial");
  // Create the "shadow" property
  // and prepopulate it with testProperty's value
  self._tmpTestProperty = ko.observable(self.testProperty());
  
  // Create our form handler
  self.updateProfile = function(val){
    // set the testProperty value to the 
    // value of the shadow property
    self.testProperty(self._tmpTestProperty());
  };

}

ko.applyBindings(new testViewModel());