vb.net 使用 JQuery 在文本框中使用日期选择器
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16434183/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Using Datepicker in Textbox using JQuery
提问by Abie Giordano
Here I am trying to create a page with a textbox where I've an idea to show a CalendarExtender (like in AJAXToolkit) but now I'm trying to get it by using JQuery, the problem is, I can't make the Calendar UI to pop out when I clicked the textbox, my upper aspx page is looking like this:
在这里，我正在尝试创建一个带有文本框的页面，我想在其中显示 CalendarExtender（例如在 AJAXToolkit 中），但现在我正在尝试使用 JQuery 来获取它，问题是，我无法制作日历单击文本框时弹出的 UI，我的上层 aspx 页面如下所示：
<link href="../Support/StyleSheet/PageStyle.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-1.9.1.js" type="text/javascript"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$("#TbOutboundOn").datepicker({
});
</script>
and the textbox that I'm trying to use is:
我尝试使用的文本框是：
<tr>
<td align="left" width="120px" height="25px">
<asp:CheckBox ID="CbOutboundOn" Text=" Outbound On" runat="server" />
</td>
<td align="center" class="style1">
<asp:Label ID="Label1" runat="server" Text=":"></asp:Label>
</td>
<td align="left" width="200px">
<asp:TextBox ID="TbOutboundOn" runat="server" Width="194px" placeholder="dd/mm/yyyy"></asp:TextBox>
</td>
<td width="645px">
</td>
</tr>
I think it's good enough, but it isn't, I can't get the calendar to show when I click the textbox in "TbOutboundOn", a friend suggested the stylesheet is the issue, but I don't quite understand, can anyone help with my problem? Btw, I used http://jqueryui.com/datepicker/#defaultas my reference.
我认为它已经足够好，但它不是，当我单击“TbOutboundOn”中的文本框时，我无法显示日历，一位朋友建议样式表是问题，但我不太明白，任何人都可以帮我解决问题？顺便说一句，我使用http://jqueryui.com/datepicker/#default作为我的参考。
I already tried to copy all the stylesheet referenced by jqueryui's datepicker sites, and combine it with my own stylesheet, but it still not working. I try to use only the stylesheet provided in jqueryui datepicker too, but still no luck.
我已经尝试复制 jqueryui 的 datepicker 站点引用的所有样式表，并将其与我自己的样式表结合起来，但它仍然无法正常工作。我也尝试仅使用 jqueryui datepicker 中提供的样式表，但仍然没有运气。
Thank you for the help.
感谢您的帮助。
回答by Vond Ritz
$(document).ready(function () {
$('#TbOutboundOn').datepicker();
//or
$('#TbOutboundOn').datepicker({ dateFormat: "dd-M-yy" });
});
u can find other parameter to modify ur datepicker here : http://api.jqueryui.com/datepicker/
你可以在这里找到其他参数来修改你的日期选择器：http: //api.jqueryui.com/datepicker/
回答by Abide Masaraure
Your id is being mangled.Use a css class selector. See how I helped another user hereand you can use the demo which takes care of update panels.
您的 id 被破坏。使用 css 类选择器。在这里查看我如何帮助另一个用户 ，您可以使用负责更新面板的演示。
<script type="text/javascript">
$(function () {
$(".clDate").datepicker();
}
</script>
<asp:TextBox ID="TbOutboundOn" runat="server" CssClass="clDate" </asp:TextBox>
See demo here
在这里查看演示
Website demo version here
网站演示版在这里
回答by Jai
See you have to use the css file for calendar too, you are missing the default closing of the calendar ();:
看到您也必须将 css 文件用于日历，您缺少日历的默认关闭();：
<link href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css"
rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-1.9.1.js" type="text/javascript">
</script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js" type="text/javascript">
</script>
<script type="text/javascript">
$(function () {
$("#TbOutboundOn").datepicker(); //<-- missing default closing this way.
});
</script>
回答by Deepak Kumar
Update following code : Your Code :
更新以下代码：您的代码：
<script type="text/javascript">
$(function () {
$("#TbOutboundOn").datepicker({
});
</script>
Update using following :
使用以下更新：
<script type="text/javascript">
$("#TbOutboundOn").datepicker();
</script>
Ajax response and Date piker code :
Ajax 响应和 Date piker 代码：
<tr>
<td align="left" width="120px" height="25px">
<asp:CheckBox ID="CbOutboundOn" Text=" Outbound On" runat="server" />
</td>
<td align="center" class="style1">
<asp:Label ID="Label1" runat="server" Text=":"></asp:Label>
</td>
<td align="left" width="200px">
<asp:TextBox ID="TbOutboundOn" runat="server" Width="194px" placeholder="dd/mm/yyyy"></asp:TextBox>
</td>
<td width="645px">
</td>
</tr>
<script type="text/javascript">
$("#TbOutboundOn").datepicker();
</script>
