我正在尝试使用 UpdatePanel 控件和 Jquery UI 作为日期选择器。但如果日期选择器控件 (TextBox) 位于 UpdatePanel 的 ContentTemplate 内,则日期选择器不起作用。
这是代码:
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script src="Scripts/jqueryui/js/jquery-ui-1.8.8.custom.min.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
$(function () {
var dates = $(" #txtDatePicker").datepicker(
{
firstDay: 1,
maxDate: '-1y',
minDate: '-1y',
dateFormat: 'dd/mm/yy',
changeMonth: true,
changeYear: true,
showAnim: "drop",
onSelect: function (selectedDate) {
var option = this.id == "txtDatePicker" ? "minDate" : "maxDate",
instance = $(this).data("datepicker");
date = $.datepicker.parseDate(
instance.settings.dateFormat ||
$.datepicker._defaults.dateFormat,
selectedDate, instance.settings);
dates.not(this).datepicker("option", option, date);
}
}
);
});
</script>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:TextBox ID="txtDatePicker" runat="server"></asp:TextBox>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnSomeButton" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
有没有办法在 UpdatePanel 内容中使用 JQuery UI 日期选择器?
最佳答案
<罢工> 然后你将控件放入面板中,它们可以更改它们的唯一 ID。 尝试一下您的代码:
var dates = $("#<%= txtDatePicker.ClientID %>").datepicker(
或将您的代码移至
$(document).ready(function() {
// Handler for .ready() called.
});
选择器中还有一个空格:
var dates = $(" #txtDatePicker").datepicker(
而不是:
var dates = $("#txtDatePicker").datepicker(
罢工><罢工>罢工>
然后使用UpdatePanel和AJAX工具包,您应该在期间使用初始化器
function pageLoad()
{ // MS AJAX - UpdatePanel initialize
InitializeDatePicker();
}
对于 UpdatePanel 中的控件以及期间
$(document).ready(function() { // jQuery
AssignFrameHeight();
});
适用于 UpdatePanel 之外的 jquery 控件。
关于jquery - 在 UpdatePanel 中使用 JQuery UI 日期选择器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6072713/