2014-05-19 1 views
1

이것은 곧장 앞으로해야합니다 ...하지만 2 시간 후에도 여전히 문제를 볼 수 없습니다.부트 스트랩 DatePicker 체크인/체크 아웃

으로 "체크 인"/ "체크 아웃"이라는 두 개의 datepickers를 구현하려고합니다.

저자 자신도 자신의 버전 here과 함께 작동하는 업데이트 된 솔루션을 문서화합니다.

var nowTemp = new Date(); 
var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0); 

var checkin = $('#dpd1').datepicker({ 
    beforeShowDay: function(date) { 
     return date.valueOf() >= now.valueOf(); 
    } 
}).on('changeDate', function(ev) { 
    if (ev.date.valueOf() > checkout.date.valueOf()) { 
     var newDate = new Date(ev.date) 
     newDate.setDate(newDate.getDate() + 1); 
     checkout.setValue(newDate); 
     checkout.setDate(newDate); 
     checkout.update(); 
    } 
    checkin.hide(); 
    $('#dpd2')[0].focus(); 
}).data('datepicker'); 
var checkout = $('#dpd2').datepicker({ 
    beforeShowDay: function(date) { 
     return date.valueOf() > checkin.date.valueOf(); 
    } 
}).on('changeDate', function(ev) { 
    checkout.hide(); 
}).data('datepicker'); 

나는 시도하고 그것을 구현

, 나는 내 콘솔 내가 그러나 차이를 만들어 표시되지 않습니다 날짜 변수를 정의하려고했습니다

Uncaught TypeError: Cannot read property 'valueOf' of undefined 

에 다음을 얻는다.

JSfiddle : http://jsfiddle.net/56bVc/1/

당신의 도움을 기대하지만, 이마 때리고 기대되지는 함께 갈 이잖아!

+0

것은 checkout.dates [0]' – Shakur

답변

0

블로그를 읽었을 때 제 이해에 따라 jquery 참조 문제가 있거나 변수를 사용하기 전에 변수가 정의되어 있지 않습니다.

좋은 점은 먼저 jquery, jquery ui & 모든 js가로드되었는지 확인한 다음 알림으로 변수를 확인하십시오.

또는 변수 참조를 제거한 다음 다른 변수의 문제인지 확인하십시오.

Uncaught TypeError: Cannot read property 'value' of undefined

http://www.sitepoint.com/forums/showthread.php?1102772-Uncaught-TypeError-Cannot-read-property-value-of-null

+0

감사합니다'에 checkin.dates [0]'와'checkout.date''에'chackin.date'을 변경 시도,하지만 난 이미 이 질문을 게시하기 전에 내 연구에서 두 페이지를 보게됩니다. – Tim

+0

안녕하세요, 저는이 오류에 대해 해결할 수있는 기본적인 아이디어를 제공합니다. 오류는 변수가 정의되지 않았 음을 나타냅니다. 너는 한 가지를 해. > If (typeof variablename == "undefined")와 같이 사용하기 전에 확인하십시오. – Ajay2707

+0

정확하고 아무리 자주 변수를 정의하더라도 정의되지 않은 채로 남아 있습니다 ... 그래서 나는 더 깊은 문제가 있다고 생각합니다. – Tim

0

무엇 부트 스트랩 버전을 사용합니까 ? 플러그인 코드를 살펴보면 DOM에서 요소를 가져 오는 데 Bootstrap 클래스 이름을 사용합니다 (BS3 및 BS2 용 버전이 있음).

올바른 형식으로되어 있는지 확인하기 위해 HTML 마크 업을 제공 할 수도 있습니다.

+0

안녕하세요, HTML 마크 업을 보려면 질문에서 JS 바이올린을 확인하십시오. – Tim

2

나는 이것이 오래된 질문이라는 것을 알고있다. 이 https://github.com/eternicode/bootstrap-datepicker 버전의 datepicker를 사용할 때도 동일한 문제가 발생했습니다.

몇 가지 문제가 발생하면 몇 가지 체크 인/체크 아웃 스크립트를 성공적으로 기록했습니다.

희망 사항은 다른 사람들이 같은 문제에 직면 할 수 있도록 도움을줍니다.

var nowTemp = new Date(); 
 
var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0); 
 

 
var checkin = $('#dpd1').datepicker({ 
 
    beforeShowDay: function(date) { 
 
     return date.valueOf() < now.valueOf() ? 'disabled' : ''; 
 
    } 
 
}).on('changeDate', function(ev) { 
 
    if (ev.date.valueOf() > checkout.viewDate.valueOf()){ 
 
     var newDate = new Date(ev.date) 
 
     newDate.setDate(newDate.getDate() + 1); 
 
     checkout.setDate(newDate); \t \t 
 
    } 
 
    else { 
 
     checkout.setDate(ev.date + 1); 
 
    } 
 
    
 
    checkin.hide(); 
 
    $('#dpd2')[0].focus(); 
 
}).data('datepicker'); 
 

 
var checkout = $('#dpd2').datepicker({ 
 
    beforeShowDay: function(date) { 
 
     return date.valueOf() <= checkin.viewDate.valueOf() ? 'disabled' : ''; 
 
    } 
 
}).on('changeDate', function(ev) { 
 
    checkout.hide(); 
 
}).data('datepicker');