[英]datepicker only visible once in asp.net using jquery
I am working on adding a date picker to date fields in my aspx page. 我正在为aspx页中的日期字段添加日期选择器。 What I want to accomplish here is to attach datepicker to the id of the input.
我要在此处完成的操作是将datepicker附加到输入的ID。 These fields are created dynamically.
这些字段是动态创建的。 I am having issues with the date picker as it is visible the first time I click on the input but wont show up again until page refresh.
我在日期选择器上遇到问题,因为这是我第一次单击输入时可见的,但直到页面刷新后才会再次显示。 I would appreciate any help.
我将不胜感激任何帮助。 Here is what I have tried.
这是我尝试过的。
My input field: 我的输入字段:
<input name="ctl00$MainContent$SubsModifier$tbDate" type="text" value="06/21/2016" onchange="javascript:setTimeout('__doPostBack(\'ctl00$MainContent$SubsModifier$tbDate\',\'\')', 0)" onkeypress="if (WebForm_TextBoxKeyHandler(event) == false) return false;" id="ctl00_MainContent_SubsModifier_tbDate" class="form-control">
jQuery: jQuery的:
$(function () {
$("[id*=tbDate]").datepicker({
buttonImageOnly: true,
buttonImage: 'http://jqueryui.com/resources/demos/datepicker/images/calendar.gif'
});
});
I have noticed that "hasDatePicker" is visible in the class the first time and is removed when I select a date from the datepicker. 我已经注意到“ hasDatePicker”在类中是第一次可见的,并且当我从datepicker中选择一个日期时将其删除。
I see you have class = "form-control"
as input attribute. 我看到您有
class = "form-control"
作为输入属性。 Add additional pseudo class class = "form-control date-picker"
and try then: 添加其他伪类
class = "form-control date-picker"
,然后尝试:
$(".date-picker").datepicker();
You can try to wrap the method in a function 您可以尝试将方法包装在函数中
function RunMeAfterControlsAreGenerated() {
$("[id$=tbDate]").datepicker({
buttonImageOnly: true,
buttonImage: 'http://jqueryui.com/resources/demos/datepicker/images/calendar.gif'
});
}
Then call it after you dynamically generate your controls on Code Behind 在“隐藏代码”上动态生成控件之后,请调用它
ScriptManager.RegisterStartupScript(this, this.GetType(), "RunMe", "RunMeAfterControlsAreGenerated();",true);
Thank you to @Felipe Deguchi and @arturas for their help. 感谢@Felipe Deguchi和@arturas的帮助。 I modified arturas answer into the following and it is working as expected.
我将arturas答案修改为以下内容,并且按预期工作。 Here is what I did.
这是我所做的。
$('body').on('focus', ".date-picker", function () {
$(".date-picker").datepicker();
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.