Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
<script src="https://code.jquery.com/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css">
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
$(function () {
    $("#dateFrom, #dateTo").datepicker({
        minDate: 0,
        onSelect: function (selectedDate) {
            if (this.id == 'dateFrom') {
                var dateMin = $('#dateFrom').datepicker("getDate");
                var rMin = new Date(dateMin.getFullYear(), dateMin.getMonth(), dateMin.getDate() + 0);
                var rMax = new Date(dateMin.getFullYear(), dateMin.getMonth(), dateMin.getDate() + 120);
                $('#dateTo').datepicker("option", "minDate", rMin);
                $('#dateTo').datepicker("option", "maxDate", rMax);
            }
        }
    });
});
</script>  
</head>
<body>
                   <div class="form-group">
                        <div class="row">
                            <label for="dateFrom" class="col-md-2 control-label">Date From:</label>
                            <div class="col-md-4">
                                <div class="input-group date">
                                    <input type="text" id="dateFrom" name="dateFrom" class="form-control col-sm-2" required value="01/01/2015"/>
                                </div>
                            </div>
                        </div>
                    </div>
​
                    <div class="form-group">
                        <div class="row">
                            <label for="dateTo" class="col-md-2 control-label">Date To:</label>
                            <div class="col-md-4">
                                <div class="input-group date">
                                    <input type="text"  id="dateTo" name="dateTo" class="form-control col-sm-2" required value="01/01/2015"/>
                                </div>
                            </div>
                        </div>
                    </div>
</body>
</html>
 
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers