JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script src="http://getbootstrap.com/dist/js/bootstrap.js"></script>
<link rel="stylesheet" href="http://getbootstrap.com/dist/css/bootstrap.css">
<script src="http://www.eyecon.ro/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
<link rel="stylesheet" href="http://www.eyecon.ro/bootstrap-datepicker/css/datepicker.css">
	<div class="modal fade" id="dlg3000to3100" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="false">
		<div class="modal-dialog" style="width: 60em; margin-left: auto; margin-right: auto">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
					<h4 class="modal-title">Отчет</h4>
				</div>
				<div class="modal-body">
					<form role="form" class="form-horizontal">
						<div class="row" style="margin:0;">
							<div class="form-group">
								<label for="ArrDate" class="col-md-2 control-label">Дата</label>
								<div class="col-md-4">
									<input data-provide="datepicker" type="text" id="ArrDate" name="ArrDate" class="form-control">
								</div>
							</div>
						</div>
			
					</form>				
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">Отмена</button>
					<button type="button" class="btn btn-primary">Применить</button>
				</div>
			</div><!-- /.modal-content -->
		</div><!-- /.modal-dialog -->
	</div><!-- /.modal -->

JavaScript

$('#ArrDate')
	.datepicker()
	.on("show", function(event){
		alert("Datepicker");
	});

	$("#dlg3000to3100")
	.on('show.bs.modal', function (event) {
		alert("Modal");
	});

	$("#dlg3000to3100")
	.modal("show");