0

i have to select date from last month and previous months dates with this code am not get back to past dates how to proceed for next?

let firstDay = new Date();
$('#date_filter_startmonthly').datepicker({
  startDate: firstDay,
  endDate: '+0d',
  todayHighlight: true,
  format: 'yyyy-mm-dd',
  orientation: 'bottom auto',
  autoclose: true,
  changeMonth: false,
  changeYear: false,
  stepMonths: false,
});
<div class="form-group mb-2">
  <label class="col-form-lable mb-0">Start Date:</label>
  <div id="date_filter_startmonthly" class="input-group date" data-target-input="nearest">
    <div data-target="#date_filter_startmonthly" data-toggle="datepicker" class="input-group datetimepicker">
      <input type="text" class="form-control form-control-sm" name="cb_sdate" placeholder="YYYY-MM-DD">
      <div class="input-group-addon "></div>
    </div>
  </div>
</div>




<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/jquery-ui.min.js" ></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/themes/base/jquery-ui.min.css" />
mplungjan
  • 169,008
  • 28
  • 173
  • 236
thrinuu
  • 3
  • 3

1 Answers1

0
  1. Include jQuery script, jQueryUI script, jQueryUI style (must maintain order of including scripts).
  2. change the selector for datepicker to $(#date_filter_startmonthly input) because datepicker should always point to an input field.
  3. date picker props are changed in order to allow to opt month or year.

$(document).ready(main);
function main(){
  $('#date_filter_startmonthly input').datepicker({
          todayHighlight: true,
          format: 'yyyy-mm-dd',
          orientation: 'bottom auto',
          autoclose: true,
  });
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/ui-lightness/jquery-ui.css" rel="stylesheet"/>


<div class="form-group mb-2">
  <label class="col-form-lable mb-0">Start Date:</label>
  <div id="date_filter_startmonthly" class="input-group date" data-target-input="nearest">
    <div data-target="#date_filter_startmonthly" data-toggle="datepicker"class="input-group datetimepicker">
      <input type="text" class="form-control form-control-sm date-input" name="cb_sdate" placeholder="YYYY-MM-DD">
      <div class="input-group-addon "></div>
    </div>
  </div>
</div>
Manik Dhanjal
  • 1
  • 1