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 
    }); 
});