提交表單爲無效日期爲2的字段

Question

我需要一些幫助來解決我的問題。我有2個輸入字段和一個掩碼（http://digitalbush.com/projects/masked-input-plugin/），就像> 12/2010（mm/yyyy）。

我希望該用戶可以在日期有效或空白時註冊表單，並在日期無效時在div中發送警報。

它的工作很好，如果我有1場，但是當我有2場，如果用戶在第二次輸入有效日期，他可以註冊形式。

否則，如果您有任何想法，以限制可開始日期之前結束日期...

感謝所有幫助;）

我的HTML代碼：

<form id="blockdate"> 
<div>date start: <input class="date" type="text"></div> 
<div>date end: <input class="date2" type="text"></div> 
<div><input class="submit" type="submit"></div> 
<div id="msg"></div> 
</form> 

我的JS代碼：

 function verifyDate(datevalue) { 

     var done = false; 

     if(datevalue != null || datevalue != ''){ 
     var tmp = datevalue.split('/'); 
     var month = tmp[0]; 
     var year = tmp[1]; 

     if(month >= 1 && month <= 12){ 
     if(year >= 1990 && year <= 2099){ 
      clean(); 
      done = true; 
      } 
      else { 
      $('#msg').html('Year invalid 1900 - 2099.'); 
      } 
     } else { 
      $('#msg').html('Month invalid'); 
     }  
    } if (datevalue < 1) { 
     done = true; 
    } 

    return done; 
    } 
function verifyDate2(datevalue2) { 

     var done = false; 

     if(datevalue2 != null || datevalue2 != ''){ 
     var tmp = datevalue2.split('/'); 
     var month = tmp[0]; 
     var year = tmp[1]; 

     if(month >= 1 && month <= 12){ 
     if(year >= 1990 && year <= 2099){ 
      clean(); 
      done = true; 
      } 
      else { 
      $('#msg').html('Year invalid 1900 - 2099.'); 
      } 
     } else { 
      $('#msg').html('Month invalid'); 
     }  
    } if (datevalue2 < 1) { 
     done = true; 
    } 

    return done; 
    } 



    function clean() { 
    $('#msg').html(''); 
    } 

    jQuery(function($) { 
    $(".date").mask("99/9999"); 

     $('.blockdate').submit(function() { 
      var datevalue = $('.date').val(); 
      var datevalue2 = $('.date2').val(); 
      return verifyDate(datevalue); 
     }); 

     $(".date").change(function(){ 
     var datevalue = $(this).val(); 
      if(datevalue.length == 7) { 
      verifyDate(datevalue); 
      } else { 
      clean(); 
      } 
     }); 


    jQuery(function($) { 
    $(".date2").mask("99/9999"); 

     $('.blockdate').submit(function() { 
      var datevalue2 = $('.date2').val(); 
      return verifyDate2(datevalue2); 
     }); 

     $(".date2").change(function(){ 
     var datevalue2 = $(this).val(); 
      if(datevalue2.length == 7) { 
      verifyDate2(datevalue2); 
      } else { 
      clean(); 
      } 
     }); 

    }); 

    }); 

Answer 1

我可以通過提供一個小的正則表達式來稍微簡化您的任務。

`^([0]?\d|1[0-2])/(199\d|20\d{2})$` 

使用這種方式

function TestDate(input) { 
    var pattern = /^([0]?\d|1[0-2])\/(199\d|20\d{2})$/; 
    return pattern.test(input); 
} 

它checkes天氣的第一部分，即位於1和12以及1990年和2099年

EDIT

之間的第二部分之間

在您測試了格式的正確性後，您可以看到如下範圍

function RangeOk (lowerDate, upperDate) { 
    return GetNumeric(lowerDate) < GetNumeric(upperDate); 
} 

function GetNumeric(input) { 
    var parts = input.split("/"); 
    var yearNum = parseInt(parts[1]) * 12; 
    // Get rid of leading 0 if exists 
    // It can be there as the pattern above allows it. 
    yearNum += parseInt(parts[0].replace(/0(\d)/, "$1")); 
    return yearNum; 
} 

有一個小的數學技巧。

Answer 2

1. 你可以使用禁用提交按鈕開始進行，直到所有formfields是有效的，那麼啓用它$("submit").prop("disabled",true);

2. 在$(input).blur()檢查，如果兩個輸入值都有效。

3. 同時獲得年度值並加以比較：startdate <= enddate

4. 啓用發送按鈕

增強：

if(datevalue2 != null || datevalue2 != '') =>||或許應該&& =>可以寫成作爲：if(!datevalue2)

var datevalue2 = $('.date2').val(); 
      return verifyDate2(datevalue2); 

=>return verifyDate2($('.date2').val())

編輯：

你只需要一個驗證功能，它們是相同的。

試試這個，以防止輸入錯誤formsubmit：

if(year >= 1990 && year <= 2099){ 
     clean(); 
     done = true; 
     $(".submit").prop("disabled",false); 
     } 

    else { 
     $('#msg').html('Year invalid 1900 - 2099.'); 
     $(".submit").prop("disabled",true); 
     } 
    } else { 
     $('#msg').html('Month invalid'); 
     $(".submit").prop("disabled",true); 
    }