Jquery datepicker : 날짜 확인 mm/dd/yyyy

Question

나는 텍스트 상자와 그 옆에 datepicker가 있으며 asp.net을 사용하고 있으며 사용자는 datepicker에서 날짜를 선택할 수도 있습니다.

날짜를 올바르게 입력하면 어떻게 확인할 수 있습니까?

<script type="text/javascript"> 
     $(document).ready(function() { 
      $('#<%=StartDate.ClientID%>').datepicker({ showOn: 'button', 
        buttonImage: '../images/Calendar.png', 
        buttonImageOnly: true, onSelect: function() { }, 
        onClose: function() { $(this).focus(); } 
      }); 
     }); 
    </script> 

Answer 1

ASP.NET을 사용하는 경우 ASP.NET 비교 검사기 [ASP.NET Date Validator]를 사용할 수 있습니다.

<asp:TextBox ID="tb" runat="server"></asp:TextBox> 

<asp:CompareValidator ID="cv" runat="server" 
ControlToValidate="tb" ErrorMessage="* Please enter a valid date!" Text="*" 
Operator="DataTypeCheck" Type="Date"></asp:CompareValidator> 

**** 업데이트 **

나는 위의 비교 검사기에 의해 실행 된 자바 스크립트를 가져다가 주위에 사용자 정의 jQuery를 검증 방법을 포장 : 당신이 때문에

<script type="text/javascript"> 
    $(document).ready(function() { 

     $.validator.addMethod("truedate", function (value, element, params) { 
      function GetFullYear(year, params) { 
       var twoDigitCutoffYear = params.cutoffyear % 100; 
       var cutoffYearCentury = params.cutoffyear - twoDigitCutoffYear; 
       return ((year > twoDigitCutoffYear) ? (cutoffYearCentury - 100 + year) : (cutoffYearCentury + year)); 
      } 

      var yearFirstExp = new RegExp("^\\s*((\\d{4})|(\\d{2}))([-/]|\\. ?)(\\d{1,2})\\4(\\d{1,2})\\.?\\s*$"); 
      try { 
       m = value.match(yearFirstExp); 
       var day, month, year; 
       if (m != null && (m[2].length == 4 || params.dateorder == "ymd")) { 
        day = m[6]; 
        month = m[5]; 
        year = (m[2].length == 4) ? m[2] : GetFullYear(parseInt(m[3], 10)); 
       } 
       else { 
        if (params.dateorder == "ymd") { 
         return null; 
        } 
        var yearLastExp = new RegExp("^\\s*(\\d{1,2})([-/]|\\. ?)(\\d{1,2})(?:\\s|\\2)((\\d{4})|(\\d{2}))(?:\\s\u0433\\.)?\\s*$"); 
        m = value.match(yearLastExp); 
        if (m == null) { 
         return null; 
        } 
        if (params.dateorder == "mdy") { 
         day = m[3]; 
         month = m[1]; 
        } 
        else { 
         day = m[1]; 
         month = m[3]; 
        } 
        year = (m[5].length == 4) ? m[5] : GetFullYear(parseInt(m[6], 10)); 
       } 
       month -= 1; 
       var date = new Date(year, month, day); 
       if (year < 100) { 
        date.setFullYear(year); 
       } 
       return (typeof (date) == "object" && year == date.getFullYear() && month == date.getMonth() && day == date.getDate()) ? date.valueOf() : null; 
      } 
      catch (err) { 
       return null; 
      } 
     }, "Please enter an actual date."); 

     $("#form1").validate(); 

     $("#one").rules('add', 
     { 
      truedate: { 
       cutoffyear: '2029', 
       dateorder: 'mdy' 
      } 
     }); 
    }); 

</script> 

<input id="one" /> 

Answer 2

을 이미 jquery를 사용하고 있다면 유효성 검사에 큰 유연성이있는 http://bassistance.de/jquery-plugins/jquery-plugin-validation/을 확인할 수 있습니다.

Answer 3

입력 유효성 확인을 위해이 핸들러를 사용합니다 :

onClose: function(dateText, inst) { 
     try { 
      $.datepicker.parseDate('dd/mm/yy', dateText); 
     } catch (e) { 
      alert(e); 
     }; 

희망, 내가 ISDATE라는 한 사용자 지정 유효성 검사기에 날짜 선택기 컨트롤의 parseDate 유틸리티 방법을 사용하여, 나는 카트린 & 문서 휴일의 접근 방식의 혼합을 사용하고 누군가

Answer 4

에 유용 할 수 있습니다.

parseDate의 형식 인수를 적절한 값 (참조 : http://docs.jquery.com/UI/Datepicker/parseDate)으로 변경하십시오.

$(document).ready(function() 
    { 
     $.validator.addMethod('isDate', function(value, element) 
     { 
      var isDate = false; 
      try 
      { 
       $.datepicker.parseDate('dd/mm/yy', value); 
       isDate = true; 
      } 
      catch (e) 
      { 

      } 
      return isDate; 
     }); 

     $("#form1").validate(); 

     $("#dateToValidate").rules("add", { isDate: true, messages: {isDate: "Date to Validate is invalid."} }); 
    }); 

그것은 아마도 발리는 UI 제어하지만 지옥을 참조 할 할하지 않는 것이 가장 좋습니다. :)