ASP.NET with jQuery DatePicker

本文关键字:DatePicker jQuery with NET ASP | 更新日期: 2023-09-27 18:04:21

我想这样做:http://jqueryui.com/datepicker/

然而,我不太确定如何:

  1. 我有一个主页-内容页面,当我试图复制该代码并将其粘贴到内容页面时,它会说"XXXX不能在内容区域"。
  2. 当用户点击提交按钮时,我如何将textbox中的日期传递给服务器端代码?

下面是我的部分代码:

. aspx:

<asp:Content ID="Content4" ContentPlaceHolderID="MainContent1" runat="server">
    <p>Date: <input type="text" id="datepicker"></p>
    <asp:Button ID="btnSubmit" runat="server" Text="Submit" />
    <asp:Label ID="lblOutput" runat="server" Text="Label"></asp:Label>
</asp:Content>

cs:

protected void btnSubmit_Click(object sender, EventArgs e)
{
    lblOutput.Text = //The date from the datepicker
}

ASP.NET with jQuery DatePicker

你需要在你的html中像这样使用runat="server":

<input type="text" id="datepicker" runat="server">

然后在你的服务器端,你可以引用datepicker作为服务器对象并访问datepicker.Value

@C。J发表评论。这是在这个问题上添加的链接中包含的源代码,它是runat=server去的地方:

这个放在你的母版页:

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">

放在你的内容页:

<p>Date: <input type="text" id="datepicker" class="datepicker"></p>
<script>
  $(document).on('ready',function() {
    $( ".datepicker" ).datepicker();
  });
</script>

HTML5使用type="date"

<asp:TextBox ID="tbDate" runat="server" type="date"></asp:TextBox>

您需要初始化您的日期选择器并将runat="server"添加到您的输入,如下所示:

$(function() {
   $("#datepicker").datepicker();
});

<input type="text" id="datepicker" runtat="server">