JQuery DatePicker Multiple Input

JQuery DatePicker Multiple Input

本文关键字：Input Multiple DatePicker JQuery      更新时间：2023-09-26

使用JQuery和ASP.Net C#3.0。

我有以下脚本：

<script>
  $(document).ready(function () {
      $("[id$=txtHiddenDate]").datepicker({
          showOn: "button",
          buttonImage: "../../images/calendar-icon.gif",
          buttonImageOnly: true
      });
  });
</script>

日、月和年有3个独立的字段。（txtDay，txtMonth，txtYear）如何将日期返回到这3个单独的字段？

非常感谢！

编辑：我也想保留隐藏字段以及

HTML

设置其他输入以保存日期片段。你可能想把这些隐藏起来。

<input id="picker"/><br>
Day:
<input id="day"/><br>
Month:
<input id="month"/><br>
Year:
<input id="year"/>

Javascript

指定一个onSelect函数，该函数解析不同的日期段并将它们分配给各自的输入。

 $(document).ready(function () {
      $("#picker").datepicker({
          showOn: "button",
          buttonImage: "../../images/calendar-icon.gif",
          buttonImageOnly: true,
          onSelect: function(strDate){
             var tokens = strDate.split("/");
              $("#day").val(tokens[1]);
              $("#month").val(tokens[0]);
              $("#year").val(tokens[2]);
          }
      });
  });

JS Fiddle:http://jsfiddle.net/9Ww8g/

您应该在普通文本框上应用日期选择器。不能将它放在一个隐藏字段或三个不同的字段上。

因为它是一个文本框，所以在服务器端（在代码后面）只有一个字符串。使用[DateTime.Parse][1]、[DateTime.TryParse][2]、[DateTime.ParseExact][3]或获取所选日期。

如果您想使用hiddenField并使其具有特定的格式（这样您就可以在知道格式的情况下进行解析），您可以使用altField和altFormat:

$("#myTextBox").datepicker({ 
    altField: "#myHiddenField",
    altFormat: "yy-mm-dd" 
});

如果是ASP.NET隐藏字段，则可能需要使用以下选择器：

altField: "input[id$=myHiddenField]"

因为在javascript中，您无法知道ASP.NET将生成的实际id（除非您在代码背后构造javascript）。

相关文章：