Datepicker 동적 최소/최대 날짜

내가 만들고있는 사이트에서 jQuery datepicker 플러그인을 사용하고 있습니다. 사용자가 지정된 날짜 범위 내에서 두 개의 날짜를 선택할 수 있어야합니다. 이것은하기에 충분합니다.Datepicker 동적 최소/최대 날짜

문제는 다른 선택 상자 (건물 이름이있는)에 따라 날짜의 허용 범위가 변경된다는 것입니다. 그래서 내가해야 할 일은 mysql 데이터베이스에서 건물을 검색하고 허용되는 최소 및 최대 날짜를 반환하고 사용자가 허용 범위 내에서 날짜 범위를 선택할 수 있도록 datepicker를 사용하는 것입니다. 내 메인 페이지에서

, 나는 현재 사용하고 있습니다 :

$('#dateStartMainChart').load(url);

는 출력하는 PHP 파일을로드하려면 : minDate 및 maxDate는 MySQL 데이터베이스에서 제대로 설치되어

<script> 
$(function() { 
    $("#dateEndMainChartSelect").datepicker({ 
     dateFormat: 'yy-mm-dd', 
     defaultDate: -1, 
     minDate: new Date(2011,03,03), 
     maxDate: +0, 
      firstDay: 1, 
     changeMonth: true, 
     changeYear: true 
    }); 
}); 
</script> 
<input type="text" class="text" value=2011-03-04 id="dateEndMainChartSelect" align="center"/>

. 그러나 결과는 datepicker 요소 대신 메인 페이지에 날짜가 포함 된 텍스트 상자가 생기는 것입니다.

의견이 있으십니까?

출처

2011-03-04 bpmccain

"minDate : new Date (2011,03,03)?>),"... 어디서? ") ... 복사/붙여 넣기 오류 또는 코드 오류가 발생 했습니까? 나는 그것이 단지 "

그건 내 부분의 오타였다. 그러나, 그것을 실행할 때 문제에 영향을 미치지 않습니다. – bpmccain

좋아요, 마침내 이것을 알아 냈습니다. 처음에는 datepicker를 정의하고 사용합니다. 동적으로 업데이트해야하는 경우 다음을 사용합니다.

$.getScript('url.php', function() {updateDate(); });

제 경우에는 선택 상자를 변경할 때이 방법을 사용합니다.

호출되는 PHP 파일은 MySQL 데이터베이스는 다음 (사용 에코)를 출력 조회 :

는

function updateDate() { 
     $("#dateStartMainChartSelect").datepicker('change',{ 
      minDate: new Date(2011,01,01), 
      maxDate: new Date(2011,02,01) 
     }); 
    }

당신은 변경할 것을 여기에 날짜 선택기의 옵션을 추가 할 수 있습니다. JasCav 덕분에 솔루션의 올바른 위치를 조사했습니다.

출처

2011-03-08 17:16:41 bpmccain

행복한 나는 너를 올바른 길로 인도했다. 다행히 해결책을 찾았습니다! – JasCav

이렇게하려면 datepicker의 "beforeShow"속성을 사용하면 도움이됩니다. 다음은 의사 코드 예제입니다. (- customRange 기능에 적절하게 필드를 조정 당신은 할 수 있지만)

// Your start and end datepickers. 
$('#dateStartMainChart, #dateEndMainChartSelect').datetimepicker({ 
    beforeShow: customRange 
}); 

// I can't take credit for this...website to tutorial is below. 
// From: http://test.thecodecentral.com/cms/jqueryui/datepicker/ 
function customRange(input) { 
    return { minDate: (input.id == 'dateEndMainChartSelect' ? $('#dateStartMainChart').datepicker('getDate') : null), 
     maxDate: (input.id == 'dateStartMainChart' ? $('#dateEndMainChartSelect').datepicker('getDate') : null) 
    }; 
}

당신은 데이터베이스에 직접보고 할 필요가 없습니다. 어쨌든 이것은 필요한 것을해야합니다.

출처

2011-03-04 17:45:45 JasCav

감사합니다. 나는 이것을 내일 시험 할 것이고 그것이 효과가 있는지 알 것이다. – bpmccain

좋아, 그래서 이것을 시도하고 그것을 종료 날짜가 시작 날짜 이후에 있어야하므로 동적으로 범위를 제한에 대한 작동합니다. 나는 이것을 비록 직접 사용하여 데이터베이스를 어떻게 볼 것인가를 알 수 없다. mysql 데이터베이스에 SELECT 쿼리를 사용하여 minDate를 설정한다고 가정 해 보겠습니다. – bpmccain

@bpmccain - 서버 측 언어를 사용하여 데이터베이스 값을 검색 한 다음 해당 값을 위 함수의 날짜와 비교하려고합니다. 필자는 데이터베이스에서 일부 필드를 채우고 사용자가 서버에 다시 게시하기 전에 플라이를 비교하려고한다고 가정했습니다. – JasCav

Datepicker 동적 최소/최대 날짜

답변

관련 문제