jquery.form驗證jquery.ui日期選擇器完成字段完成

Question

之前運行我有以下JQuery驗證附加到表單具有兩個日期選擇字段：

$("#submitform").validate(
     { 
      debug: true, 
      rules: { 
       summary: { 
        validateWidthLimits: {max: 49, min: 5} 
       }, 
       description: { 
        validateWidthLimits: {max: 49, min: 5} 
       }, 
       start_date: { //HERE** 
        validateDate: {field: "#end_date", when: "before"} 
       }, 
       end_date: { //HERE**       
        validateDate: {field: "#start_date", when: "after"} 
       }, 
       geocomplete: { 
        validateWidthLimits: {max: 500, min: 5} 
       } 
      }, 
      submitHandler: function(event, validator) { 
       // submitForm(); 
       return false; 
      }, 
      invalidHandler: function(event, validator) { 
       setFeedback2($("#mainfbf"), "All required fields must be filled out", true); 
       return false; 
      } 
    }); 

當我使用日期選擇器與例如起始日期選擇日期，我希望start_date檢查它是否在end_date之前，反之亦然。

驗證函數是：

$.validator.addMethod("validateDate", function(value, element, param) { 
if (!value) { 
    message = "*"; 
} else if (!value.match(/^\d\d?\/\d\d?\/\d\d\d\d$/)) { 
    message = "Format dd/mm/yyyy"; 
} 
//default to true 
var fieldComparison = true; 

//Validate against another date field (before:after) 
if (param.field) { 
    var compareTo = $(param.field).val(); 

    var compareToDate = Date.parse(compareTo,"dd/MM/yyyy"); 
    var valueDate = Date.parse(value, "dd/MM/yyyy"); 
    var comparisonInt = valueDate.compareTo(compareToDate);//remove line 

    if (param.when == "after" && ((compareToDate.compareTo(valueDate)) < 0)) { 
     fieldComparison = false; 
     message = "Start date before End date"; 
    } else if (param.when == "before" && ((compareToDate.compareTo(valueDate)) < 0)) { 
     fieldComparison = false; 
     message = "End date before Start date"; 
    } 
} 

if (value.match(/^\d\d?\/\d\d?\/\d\d\d\d$/) && fieldComparison) { 
    return true; 
} else { 
    return feedBackOverride(param); 
} 

}，messageFunction）;

現在這個邏輯並不完整，但是當我從datepicker中選擇一個日期時，它會被卡住，它會根據舊值而不是新選擇的值進行驗證。

日期選擇器代碼：

$(".datepicker1").datepicker({ 
     minDate:0, 
     dateFormat : 'dd/mm/yy', 
     changeMonth : true, 
     changeYear : true, 
     yearRange : '-0:+10' 
    }); 

任何想法ofhow強制驗證等到領域已實際完成？

Answer 1

你可以有一個隱藏的字段爲你驗證這個規則。

hiddenDate: { 
      required: function() 
      { 
       var MESSAGE = 'VALUES NOT ENTERED'; 

       //if Start Date and End Date is filled then do date comparison 
       //otherwise return false since the fields are not filled. 

       if($('#start_DATE').val() && $('#end_DATE').val()) 
       { 
        /* Verify start and end dates are correctly formatted */ 

        if(isStartDateValid && isEndDateValid) 
        { 
        var selectedStart = $('#start_DATE').val(); 
        var selectedEnd = $('#end_DATE').val(); 

        if(selectedStart > selectedEnd) 
         MESSAGE = "Start date greater than end date" 
        else 
         MESSAGE = "Start date smaller than end date" 

        } 

       } 

       return MESSAGE ; 
      } 
      } 

我添加了消息，這將是true/false的值。