JSFiddle - React, Tailwind, and code Playground

by Bjørn Tennøe

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="http://getbootstrap.com/dist/css/bootstrap.css">
<table class="table table-hover">
    <colgroup>
        <col width="50" />
        <col width="100" />
        <col width="100" />
    </colgroup>
    <tr>
        <td>&nbsp;</td>
        <td><strong>Set start and end date</strong></td>
        <td>&nbsp;</td>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td>
            <div class="input-group">
                <input type="text" id="datepicker-start" class="form-control" placeholder="Start Date" />	<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
            </div>
        </td>
        <td>&nbsp;</td>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td>
            <div class="input-group">
                <input type="text" id="datepicker-end" class="form-control" placeholder="End Date" />	<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
            </div>
        </td>
        <td>&nbsp;</td>
    </tr>
</table>

JavaScript

$("#datepicker-start").datepicker({
        /*
        showOn: "button",
        buttonImage: "http://jqueryui.com/resources/demos/datepicker/images/calendar.gif",
        buttonImageOnly: true
*/
    });
    $("#datepicker-end").datepicker({
        showOn: "button",
        buttonImage: "http://jqueryui.com/resources/demos/datepicker/images/calendar.gif",
        buttonImageOnly: true

    });