datepickerで日付の値を取得したい

質問

jQueryのdatepickerを実装しました。
そこに、jquery.validate.jsを当てて、空欄の時にエラーが出るようにしました。

しかし、日付を選択しても、エラーメッセージが出てしまいます。
（※日付をカレンダーで選択後、再び日付の欄をクリックするとエラーが消えます。）

どうやら、日付の値を取得していないような気がしています。

どなたかご存じの方がいらっしゃいましたら、教えていただけると幸いです。

<script type="text/javascript">
$(function(){
　$("#datepicker").datepicker()
});
</script>
<script>
jQuery(".validDate").validate({
expression: "if(VAL != '') return true; else return false;",
message: "希望日をお選びください。"
});
</script>

<input type="text" name="reservationdate" class="rDate validDate" id="datepicker"/>

回答No.1

shockatz · ベストアンサー

これ、きっと頻出ですね。

jQuery.validate は keyDown や change イベントを監視しているので、DateTimePicker などの「外部投入」型の
もジュールでは値の変化を検出できない、と。

DatePicker終了時に強制的にフォーカスを当てるとか。

<script type="text/javascript">
$(function(){
　$("#datepicker").datepicker({
　　onClose : function(){
　　　this.focus();
　　}
　})
});
</script>

ひょっとしたら一部のブラウザでonCloseのタイミングが合わないかも。ならば、

<script type="text/javascript">
$("#datepicker").datepicker({
　　onClose: function() {
　　　setTimeout(function(){
　　　　$("#datepicker").focus();
}, 500);
}
});
</script>

でもいいかな。

お礼

お忙しい中、解りやすい回答をしてくださって、ありがとうございました！

<script type="text/javascript">
$(function(){
　$("#datepicker").datepicker({
　　onClose : function(){
　　　this.focus();
　　}
　})
});
</script>

を記入したら、エラーメッセージがでなくなりました！