Skip to main content
adicionou 30 caracteres ao conteúdo
Fonte Link
Wallace Vizerra
  • 107,4mil
  • 106
  • 440
  • 920

vocêVocê pode setar o minDatedefinir as opções minDate e o maxDate.maxDate para fazer isso:

$(function () {
  var data = {};
  data.inicio = $("#data_inicio");
  data.fim = $("#data_fim");
  
  data.inicio.datepicker({
    onSelect: function () {
      data.fim.datepicker("option", "minDate", data.inicio.datepicker("getDate"));      
    }
  });  
  data.fim.datepicker({
    onSelect: function () {
      data.inicio.datepicker("option", "maxDate", data.fim.datepicker("getDate"));      
    }
  });  
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.theme.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css" rel="stylesheet"/>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.js"></script>

<input id="data_inicio" type="text" />
<input id="data_fim" type="text" />

você pode setar o minDate e o maxDate.

$(function () {
  var data = {};
  data.inicio = $("#data_inicio");
  data.fim = $("#data_fim");
  
  data.inicio.datepicker({
    onSelect: function () {
      data.fim.datepicker("option", "minDate", data.inicio.datepicker("getDate"));      
    }
  });  
  data.fim.datepicker({
    onSelect: function () {
      data.inicio.datepicker("option", "maxDate", data.fim.datepicker("getDate"));      
    }
  });  
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.theme.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css" rel="stylesheet"/>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.js"></script>

<input id="data_inicio" type="text" />
<input id="data_fim" type="text" />

Você pode definir as opções minDate e o maxDate para fazer isso:

$(function () {
  var data = {};
  data.inicio = $("#data_inicio");
  data.fim = $("#data_fim");
  
  data.inicio.datepicker({
    onSelect: function () {
      data.fim.datepicker("option", "minDate", data.inicio.datepicker("getDate"));      
    }
  });  
  data.fim.datepicker({
    onSelect: function () {
      data.inicio.datepicker("option", "maxDate", data.fim.datepicker("getDate"));      
    }
  });  
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.theme.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css" rel="stylesheet"/>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.js"></script>

<input id="data_inicio" type="text" />
<input id="data_fim" type="text" />

Fonte Link
Tobias Mesquita
  • 23,1mil
  • 1
  • 32
  • 52

você pode setar o minDate e o maxDate.

$(function () {
  var data = {};
  data.inicio = $("#data_inicio");
  data.fim = $("#data_fim");
  
  data.inicio.datepicker({
    onSelect: function () {
      data.fim.datepicker("option", "minDate", data.inicio.datepicker("getDate"));      
    }
  });  
  data.fim.datepicker({
    onSelect: function () {
      data.inicio.datepicker("option", "maxDate", data.fim.datepicker("getDate"));      
    }
  });  
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.theme.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css" rel="stylesheet"/>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.js"></script>

<input id="data_inicio" type="text" />
<input id="data_fim" type="text" />