ASP.net 上的 JQuery DatePicker

Posted 2023-05-09

【中文标题】ASP.net 上的 JQuery DatePicker

【英文标题】：JQuery DatePicker on ASP.net

【发布时间】：2015-02-25 13:36:32

【问题描述】：

嗯，

我试图将日期选择器放在 ASP.net 表单上..

我看到这段代码可以做到..

<script>
$(function() 
    $( "#<%= txtDate.ClientID %>" ).datepicker();
);
</script>

<form id="form1" runat="server">
  <div>
    <asp:TextBox ID="txtDate" runat="server" />
  </div>
</form>

我只是想知道如何对此应用验证以及如何显示错误消息..？

验证，例如格式，如果我输入 2 个日期，第一个 Today 等。

JQuery 非常新，任何帮助将不胜感激！

【问题讨论】：

验证是什么？需要\格式？

抱歉不清楚，我编辑了问题...

也许你想要 jQuery 验证。在这里查看jqueryvalidation.org

【参考方案1】：

如果您正在寻找验证，请尝试此操作。

<script>
$(function() 
    $( "#<%= txtDate.ClientID %>" ).datepicker(
                minDate:0,
                dateFormat: 'dd-mm-yy',
                showOtherMonths: true,
                onSelect: function( selectedDate ) 
                    console.log(selectedDate);
                    // Here you can do all the validation you want.
                
  );
);
</script>

【参考方案2】：

我为此提取了我的代码。如果你知道 jQuery/javascript，代码是不言自明的。

 var dateToday = new Date();
 var fromDate = (dateToday.getMonth() + 1) + "/" + dateToday.getDate() + "/" +    dateToday.getFullYear()
 var toDate = (dateToday.getMonth() + 1) + "/" + dateToday.getDate() + "/" + dateToday.getFullYear()

// 初始化起始日期

 $('#datepicker1').datepicker(
    todayBtn: "linked",
    multidate: false,
    autoclose: true,
    todayHighlight: true
 );

// 处理fromDate点击

$('#datepicker1').datepicker('setDate', fromDate);

$('#datepicker1').datepicker().on('changeDate', function (e) 
    fromDate = $('#datepicker1').val().toString();
    if (fromDate > toDate) 
        toDate = fromDate;
        $('#datepicker2').datepicker('setDate', toDate);
    
);

// 初始化到日期

$('#datepicker2').datepicker(
    todayBtn: "linked",
    multidate: false,
    autoclose: true,
    todayHighlight: true
);

//处理到日期点击

$('#datepicker2').datepicker('setDate', toDate);

$('#datepicker2').datepicker().on('changeDate', function (e) 
    toDate = $('#datepicker2').val().toString();
    if (toDate < fromDate) 
        fromDate = (new Date(toDate).getMonth() + 1) + "/01/" + new Date(toDate).getFullYear();
        $('#datepicker1').datepicker('setDate', fromDate);
    
);

我忘了说我正在使用这个https://github.com/eternicode/bootstrap-datepicker/blob/release/docs/index.rst

【参考方案3】：

把你的脚本改成这个

<script>
$(function() 
$("input[id$=txtDate]").datepicker();
);
</script>

这将获得具有 txtDate 确切 id 的输入元素。

$("input[id$=txtDate]").datepicker();

这里是你可以检查的验证

var txtValue=$("input[id$=txtDate]").val();
if(txtValue)

//it means textbox has some value proceed further.

【讨论】：

如果你能解释一下这里发生了什么，那就太好了......以及如何使用此代码应用验证和错误消息？

现在检查更新的答案是否清楚或需要更多解释。

这样更清楚了.. 谢谢.. 如果我要进行问题末尾提到的验证怎么办？

验证你可以使用jquery插件。