JSFiddle - React, Tailwind, and code Playground
by Tattus
HTML
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/e8bddc60e73c1ec2475f827be36e1957af72e2ea/build/css/bootstrap-datetimepicker.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment-with-locales.js"></script>
<script src="https://cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/e8bddc60e73c1ec2475f827be36e1957af72e2ea/src/js/bootstrap-datetimepicker.js"></script>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<div id="wrap">
<div id="mainwrapper" class="container-fluid">
<div class="panel panel-info" style="margin-top: 1%">
<div class="panel-heading" id="JnName">Date Picker</div>
<div class="panel-body">
<form name="form3" role="form">
<div class="table-responsive" style="size:auto; max-width: 100%;">
<table class="table table-bordered table-striped" id="System Analysis">
<tbody>
<tr>
<td width="50%">
<div class="row-fluid">
<div class="col-xs-4">
<div class="box">From Date:</div>
</div>
<div class='col-sm-8'>
<div class="form-group">
<div class='input-group date' id='rptDateFrom'>
<input type='text' name='rptDateFrom' class="form-control" id="rptDateFrom" onkeydown="return false" value='' />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
</div>
</td>
<td width="50%">
<div class="row-fluid">
<div class="col-xs-6">
<div class="box">From...
JavaScript
$(function () {
$('#rptDateFrom').datetimepicker({
//viewMode: 'months',
format: 'DD/MM/YYYY',
widgetPositioning:
{
horizontal: 'left',
vertical: 'bottom'
}
});
});