JSFiddle - React, Tailwind, and code Playground

by craigcav

HTML

<script src="http://arshaw.com/js/fullcalendar-1.5.1/jquery/jquery-ui-1.8.11.custom.min.js"></script>
<script src="http://arshaw.com/js/fullcalendar-1.5.1/fullcalendar/fullcalendar.min.js"></script>
<link rel="stylesheet" href="http://arshaw.com/js/fullcalendar-1.5.1/fullcalendar/fullcalendar.css">
<script src="http://knockoutjs.com/js/jquery.tmpl.js"></script>
<script src="http://knockoutjs.com/js/knockout-1.2.0.js"></script>
<script src="http://www.datejs.com/build/date.js"></script>



<input type="text" data-bind="value: someDate, cleanDate: someDate" />

JavaScript

var viewModel = {
    someDate: ko.observable(new Date().toString('MMMM d, yyyy'))
};


ko.bindingHandlers.cleanDate = {
    init: function(element, valueAccessor) {
        $(element).change(function() {
            var value = valueAccessor();
            value(Date.parse(value()).toString('dddd, MMMM d, yyyy'));
        });             
    }
};

ko.applyBindings(viewModel);