Невозможно выбрать дополнительные даты в datepicker с помощью jquery

Я новичок здесь, я установил стартовую дату +60 D, и я смущен тем, почему я не могу выбрать дальнейшие даты, мой план таков, что к установке задана дата по умолчанию диапазон + 60D, и я был бы в состоянии выбрать дополнительные даты .Здесь это на примере ссылку http://jsfiddle.net/jquerybyexample/LGw6F/Невозможно выбрать дополнительные даты в datepicker с помощью jquery

From: <input type="text" id="txtFromDate" /> 
To: <input type="text" id="txtToDate" /> 


$(document).ready(function(){ 
    $("#txtFromDate").datepicker({ 
     minDate: 0, 
     maxDate: "+60D", 
     numberOfMonths: 2, 
     onSelect: function(selected) { 
      $("#txtToDate").datepicker("option","minDate", selected) 
     } 
    }); 
    $("#txtToDate").datepicker({ 
     minDate: 0, 
     maxDate:"+60D", 
     numberOfMonths: 2, 
     onSelect: function(selected) { 
      $("#txtFromDate").datepicker("option","maxDate", selected) 
     } 
    }); 
});

источник

2016-12-07 Teapetetose

Что я понял: вы хотите выбрать первое свидание между сегодняшним днем и 60 днями в будущем И ТОЛЬКО выбрать второе время между ним и другими 60 днями в будущем с первой выбранной даты? – Daidon

@ Дайдон, нет, сэр, я имею в виду, что я смог установить дату по умолчанию + 60D, но проблема в том, что я не могу выбрать дополнительные даты, например, есть ли способ установить диапазон дат по умолчанию, и я все еще могу выбрать дальнейшие даты? – Teapetetose

На основе вашего кода maxDate установлен только на +60 дней (после текущей даты), поэтому вы не можете выбрать дополнительные даты. Что вы действительно хотите? Если вы хотите начать выбирать даты по истечении 60 дней с текущей даты, вы должны сменить minDate вместо maxDate. – Ronald

Для предварительного заполнения вашего ввода-поля ("поставить дату по умолчанию"), сделать это:

$(function(){ 
 
    $("#txtFromDate").datepicker({ 
 
     minDate:0, 
 
     maxDate: "+60D", 
 
     numberOfMonths: 2, 
 
    }); 
 
    $("#txtToDate").datepicker({ 
 
     minDate:0, 
 
     maxDate:"+60D", 
 
     numberOfMonths: 2, 
 
    }); 
 
    var default_date = new Date(); 
 
    default_date.setDate(default_date.getDate()+60); 
 
    $('#txtFromDate').datepicker('setDate', new Date()); 
 
    $('#txtToDate').datepicker('setDate', default_date); 
 
}); 
 
$("#txtFromDate").datepicker({ 
 
     onSelect: function(dateText) { 
 
      $("#txtToDate").datepicker("option", "minDate", $('#txtFromDate').datepicker("getDate")); 
 
      var date2 = $("#txtFromDate").datepicker("getDate"); 
 
      date2.setDate(date2.getDate()+60); 
 
      $("#txtToDate").datepicker("option", "maxDate", date2); 
 
     } 
 
    });

body 
 
{ 
 
    font-size:8pt; 
 
    font-family:Verdana; 
 
    padding: 5px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
 
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
 
<br/> 
 
From: <input type="text" id="txtFromDate" /> 
 
To: <input type="text" id="txtToDate" /> 
 

 
<!-- begin snippet: js hide: false console: true babel: false -->

Полный текст:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
 
<html xmlns="http://www.w3.org/1999/xhtml"> 
 
<head> 
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
 
<title>Test</title> 
 
<style> 
 
body 
 
{ 
 
    font-size:8pt; 
 
    font-family:Verdana; 
 
    padding: 5px; 
 
} 
 
</style> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
 
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
 
</head> 
 
<body> 
 
    
 
<br/> 
 
From: <input type="text" id="txtFromDate" /> 
 
To: <input type="text" id="txtToDate" /> 
 

 
<script type="text/javascript"> 
 
$(function(){ 
 
\t $("#txtFromDate").datepicker({ 
 
\t \t minDate:0, 
 
\t \t maxDate: "+60D", 
 
\t \t numberOfMonths: 2, 
 
\t }); 
 
\t $("#txtToDate").datepicker({ 
 
\t \t minDate:0, 
 
\t \t maxDate:"+60D", 
 
\t \t numberOfMonths: 2, 
 
\t }); 
 
\t var default_date = new Date(); 
 
\t default_date.setDate(default_date.getDate()+60); 
 
\t $('#txtFromDate').datepicker('setDate', new Date()); 
 
\t $('#txtToDate').datepicker('setDate', default_date); 
 
}); 
 
$("#txtFromDate").datepicker({ 
 
    onSelect: function(dateText) { 
 
     $("#txtToDate").datepicker("option", "minDate", $('#txtFromDate').datepicker("getDate")); 
 
     var date2 = $("#txtFromDate").datepicker("getDate"); 
 
     date2.setDate(date2.getDate()+60); 
 
     $("#txtToDate").datepicker("option", "maxDate", date2); 
 
    } 
 
}); 
 
</script> 
 

 
</body> 
 
</html>

Я надеюсь, что это то, что вы хотите. С уважением

источник

2016-12-07 03:12:43 Daidon

Обновленный снова основан на последней комментарий.

Обновленный jFiddle (http://jsfiddle.net/LGw6F/2230/)

$(document).ready(function(){ 
    $("#txtFromDate").datepicker({ 
    dateFormat: 'yy-mm-dd', 
    changeMonth: true, 
    minDate: new Date(), 
    numberOfMonths: 2, 
    onSelect: function(selected) { 
      $("#txtToDate").datepicker("option","minDate",selected); 
      var selectedDate = $("#txtFromDate").datepicker("getDate"); 
      var msecsInADay = 5184000000; 
      var endDate = new Date(selectedDate.getTime() + msecsInADay); 
      $("#txtToDate").datepicker("option","maxDate",endDate); 

     } 
    }); 

    $("#txtToDate").datepicker({ 
     dateFormat: 'yy-mm-dd', 
     numberOfMonths: 2, 
    }); 
});

источник

2016-12-07 02:47:27 Ronald

Я бы угадал тот же – Daidon

@Daidon, вопрос OP не ясен. Даже он сам не знает, что он хочет делать. LOL – Ronald

Я думаю, что OP может иметь легкие трудности с английским. Он может сформулировать свой вопрос лучше. В противном случае я не вижу, как кто-то даст правильный ответ. – Daidon

Невозможно выбрать дополнительные даты в datepicker с помощью jquery

ответ

Смежные вопросы