JSFiddle - React, Tailwind, and code Playground

by Rahul Sharma

HTML

<p><input data-bind="value: firstName"></p>

<p><input data-bind="value: lastName"></p>

<p><input data-bind="value: fullName"></p>
    
    <p> <span data-bind="text: upperFullName"> </span> </p>

JavaScript

function AppViewModel() {
    var self = this; 
    self.firstName = ko.observable('rahul');
    self.lastName = ko.observable('sharma');
    self.fullName = ko.computed(function() {
      return self.firstName() +' ' + self.lastName();
    });
    self.upperFullName = ko.computed(function() {
      return self.fullName.toUpperCase();
    });
    
    
        
  
}

// Activates knockout.js
ko.applyBindings(new AppViewModel());