0

我想驗證日期字段,所以當你如果你選擇日期在未來和第二個輸入框中選擇今天的日期它不應該讓你提交表單。jQueryUI DatePicker驗證

我有它的工作,所以你不能選擇昨天的日期 - 它的日期比較,我似乎無法正常工作。

/js/jquery-ui-1.8.6.custom.min.js"/> 
/js/jquery.validate.js" /> 
/js/jquery.ui.datepicker.validation.js" /> 

<asp:TextBox ID="txtStartDate" runat="server" CssClass="DatepickerInput validBeforeDatepicker" /> 
<asp:TextBox ID="txtEndDate" runat="server" CssClass="DatepickerInput validAfterDatepicker" /> 

<script type="text/javascript"> 
$(function() { 
    $("#tabs").tabs(); 
}); 

$('.validBeforeDatepicker,.validAfterDatepicker').datepicker(); 


$(function() { 
    $(".DatepickerInput").datepicker({ 
     showOn: "button", 
     buttonImage: "/assets/img/calendar.gif", 
     buttonImageOnly: true, 
     minDate: 0, 
     required: true, 
     message: "This is a required field", 
     dateFormat: 'dd-mm-yy' 
    }); 
}); 

$(function() { 
    $("#validAfterDatepicker").datepicker({ 
     showOn: "button", 
     buttonImage: "/assets/img/calendar.gif", 
     buttonImageOnly: true, 
     minDate: +1, 
     required: true, 
     message: "This is a required field", 
     dateFormat: 'dd-mm-yy'    
    }); 
});  

我下面這個例子,但我會錯了地方,並不能似乎完全把我的手指上可能是什麼。

網站:http://bit.ly/WdZf10

請不要提交表單,因爲它只會是垃圾郵件,如果在網站上測試的形式。你可以看到它甚至在提交表格之前不會驗證。

回答

0

發現問題的解決方法以及可能使用的更少的代碼。以爲我會分享,如果有人被卡住了,他們可以使用它。

<script type="text/javascript"> 

$(function() { 

    function getDiff() { 
     var from = $(".start").val(); 
     var till = $(".fin").val(); 
     var c = from.split("/"); 
     beg = new Date(c[2], c[1] - 1, c[0]); 
     var d = till.split("/"); 
     en = new Date(d[2], d[1] - 1, d[0]); 
     var rest = (en - beg)/86400000; 
     var txt = rest == 0 ? "" : rest + " days" 
     $("#res").text(txt); 
    } 

    $(".start").datepicker({ 
     changeMonth: false, 
     changeYear: false, 
     showAnim: "fadeIn", 
     gotoCurrent: true, 
     minDate: 0, //change this to +3 to start 3 days from now 
     dateFormat: "dd/mm/yy", 
     onSelect: function (dateText, inst) { 
      $(".fin").val(dateText); 
      $(".fin").datepicker("option", "minDate", dateText); 
      getDiff(); 
     } 
    }); 

    $(".fin").datepicker({ 
     dateFormat: "dd/mm/yy", 
     changeMonth: true, 
     changeYear: true, 
     showAnim: "fadeIn", 
     onSelect: getDiff 
    }); 
});