2011-01-26 23 views
8

Tôi có một số xác thực cơ bản trên biểu mẫu bao gồm hai giao diện người dùng jQuery DatePickers. Định dạng của ngày là yy-mm-dd. Có một yêu cầu yêu cầungày trên cả hai DatePickers.Trình xác thực ngày trên DatePicker kích hoạt phủ định sai trong IE7/IE8

Những công việc như mong đợi trong Chrome & FF, nhưng kích hoạt phủ định sai (đầu vào hợp lệ được cho là không hợp lệ) trong IE7/IE8.

chọn ngày thiết lập:

$('.datepicker').datepicker({ 
    dateFormat: 'yy-mm-dd' 
}); 

này không liên quan nhưng tôi figured tôi sẽ bao gồm, chỉ trong trường hợp:

$.validator.addMethod("endDate", function(value, element) { 
    var startDate = $('#startDate').val(); 
    return Date.parse(startDate) <= Date.parse(value); 
}); 

Việc xác nhận thực tế:

$('#ExampleForm').validate({ 
    rules: {  
     StartDate: { 
      required: true, 
      date: true 
     }, 
     EndDate: { 
      required: true, 
      date: true, 
      endDate: true 
     } 
    }, 
    messages: { 
     StartDate: { 
      required: "Start Date required", 
      date: "Invalid date. Must be formatted yyyy-mm-dd" 
     }, 
     EndDate: { 
      required: "End Date required", 
      date: "Invalid date. Must be formatted yyyy-mm-dd", 
      endDate: "Start date must occur before end date." 
     } 
    }, 
    errorPlacement: function(error, element) { 
     error.appendTo(element.parent().next()); 
    }, 
    submitHandle: function(form) { 
     form.submit(); 
    } 
}); 

Trong IE7/IE8, đầu vào hợp lệ (chỉ cần chọn ngày) với cả DatePickers sẽ dẫn đến ngày lỗi ("Ngày không hợp lệ. Phải được định dạng yyyy-mm-dd "). Điều này không xảy ra trong các trình duyệt khác.

Nó cũng không tạo ra bất kỳ lỗi Javascript.

Cảm ơn trước,

Ian

Trả lời

13

tôi nghĩ rằng bạn đang tìm kiếm dateISO tùy chọn:

$('form').validate({ 
    rules: { 
     StartDate: { 
      required: true, 
      dateISO: true 
     }, 
     EndDate: { 
      required: true, 
      dateISO: true 
     } 
    }, 
    messages: { 
     StartDate: { 
      required: "Start Date required", 
      dateISO: "Invalid date. Must be formatted yyyy-mm-dd" 
     }, 
     EndDate: { 
      required: "End Date required", 
      dateISO: "Invalid date. Must be formatted yyyy-mm-dd" 
     } 
    }, 
    submitHandler: function(form) { 
     form.submit(); 
    } 
}); 

IE sẽ không phân tích số ngày trong yyyy-mm-dd định dạng, đó là lý do sử dụng thường xuyên 0.123.không thành công trong IE. Tôi tin rằng jQuery xác thực chỉ sử dụng Date.parse hoặc new Date(dateString) để kiểm tra tính hợp lệ. Để kiểm tra điều này, hãy thử thực hiện new Date("1987-11-14") và cảnh báo giá trị trong IE và FF. Bạn sẽ nhận được NaN trong IE và một đối tượng ngày trong FF.

Dưới đây là một ví dụ làm việc: http://jsfiddle.net/andrewwhitaker/QqSrJ/2/

3

Ví dụ để vượt qua IE NaN

var startDate = "1987-11-14"; 
startDate  = startDate.split("-"); 
startDate  = new Date(startDate[0], + startDate[1], startDate[2]); 
alert(startDate); 
1

Gửi ngày làm thế nào bạn cần nó định dạng để một lĩnh vực tiềm ẩn trong hình thức của bạn sử dụng altFieldaltFormat, điều này cố định NaN của tôi lỗi.

$("#selectorDate").datepicker({ 
    dateFormat: 'mm/dd/yy', 
    altField: "#another_field_date", 
    altFormat: "yy-mm-dd" 
}); 
0

Tôi đã có một vấn đề trong mã của riêng tôi, nơi mà các định dạng ngày là giống như mô tả ở trên và hình thức trong JSP (với sự hỗ trợ ít từ thẻ hình thức Spring) trông như thế này:

<fmt:formatDate pattern="yyyy-MM-dd" value="${user.dateOfBirth}" var="dob"/> 
<form:input id="date-of-birth" type="date" path="dateOfBirth" value="${dob}"/> 

Vấn đề là trường ngày là tùy chọn (bắt buộc = false trong quy tắc xác thực JQuery), nhưng nó đã sử dụng DatePicker và do đó được xác thực tự động khi nó được điền. Vấn đề là trên tất cả các trình duyệt, và trên IE9 (và lên) nó được xác nhận chính xác, nhưng trên IE8, nó gây ra một "không hợp lệ ngày" xác nhận dừng lại.

Tôi đã chơi với các quy tắc xác thực jquery, tôi đã thử sử dụng dateISO (mặc dù tôi không có nghĩa là giải pháp này sẽ không hoạt động đối với một số), không có kết quả.

Hóa ra trong trường hợp của tôi, tất cả những gì tôi phải làm là xóa thuộc tính 'type = "date"'. Bây giờ ngày xác nhận đúng, và vẫn là một trường tùy chọn.

0

Trong trường hợp của tôi thuộc tính class = "date" (không gõ = "date") trên trường đầu vào đã làm cho trình xác nhận tự động thêm xác nhận ngày vào trường, kích hoạt âm tính giả trong IE8. Vì vậy, tôi đã thay đổi lớp học thành 'ngày-chọn', sau đó sử dụng quy tắc dateISO như trong câu trả lời của Andrew Whitaker.

Các vấn đề liên quan