我一直在使用jQuery日期选择器，它很棒。但是，我现在正在用户控件中使用它，并且无法使其失败并出现错误：
对象在创建日期选择器时不支持此属性或方法。
我的网站结构如下：
[Root]
- [Pages]
- MasterPage.Master
- GoodsReceived.aspx
- [WebControls]
- [PageControls]
- PopupBatchEntry.ascx
我已经将jQuery添加到母版页中，如下所示：
<link href="../App_Themes/Default/Style.css" rel="stylesheet" type="text/css" />
<link href="../JavaScripts/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="../JavaScripts/jquery.min.js" type="text/javascript"></script>
<script src="../JavaScripts/jquery-ui.min.js" type="text/javascript"></script>
我已经将jQuery添加到User控件中，如下所示：
<script src="../../JavaScripts/jquery.min.js" type="text/javascript"></script>
<script src="../../JavaScripts/jquery-ui.min.js" type="text/javascript"></script>
我试图输入到日期选择器的文本框位于gridview内的用户控件中（css类：datePicker）
<asp:GridView ID="gvBatchDetails" runat="server" AutoGenerateColumns="False" EnableModelValidation="True">
<Columns>
<asp:TemplateField HeaderText="Use By">
<EditItemTemplate>
<asp:TextBox ID="txtUseBy" runat="server" Text='<%# Bind("UseBy", "{0:dd/MM/yyyy}") %>'
Width="80px" CssClass="datePicker"></asp:TextBox>
<%-- <cc1:CalendarExtender ID="txtUseBy_CalendarExtender" runat="server"
Enabled="True" Format="dd/MM/yyyy" TargetControlID="txtUseBy">
</cc1:CalendarExtender>--%>
<asp:RequiredFieldValidator ID="valSellByReq" runat="server" ControlToValidate="txtUseBy"
ErrorMessage="* Required" Display="Dynamic"></asp:RequiredFieldValidator>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label3" runat="server" Text='<%# Bind("UseBy", "{0:dd/MM/yyyy}") %>'></asp:Label>
</ItemTemplate>
<HeaderStyle HorizontalAlign="Left" />
<ItemStyle HorizontalAlign="Left" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Sell By">
<EditItemTemplate>
<asp:TextBox ID="txtSellBy" runat="server" Text='<%# Bind("SellBy", "{0:dd/MM/yyyy}") %>'
Width="80px" CssClass="datePicker"></asp:TextBox>
<%-- <cc1:CalendarExtender ID="txtSellBy_CalendarExtender" runat="server" Enabled="True"
Format="dd/MM/yyyy" TargetControlID="txtSellBy">
</cc1:CalendarExtender>--%>
<asp:RequiredFieldValidator ID="valSellByRequired" runat="server" ControlToValidate="txtSellBy"
ErrorMessage="* Required" Display="Dynamic"></asp:RequiredFieldValidator>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label4" runat="server" Text='<%# Bind("SellBy", "{0:dd/MM/yyyy}") %>'></asp:Label>
</ItemTemplate>
<HeaderStyle HorizontalAlign="Left" />
<ItemStyle HorizontalAlign="Left" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Quantity Delivered">
<EditItemTemplate>
<asp:TextBox ID="txtQuantityDelivered" runat="server" Text='<%# Bind("QuantityDelivered") %>'
Width="75px"></asp:TextBox>
<asp:RequiredFieldValidator ID="valQuantityRequired" runat="server" ControlToValidate="txtQuantityDelivered"
ErrorMessage="* Required" Display="Dynamic"></asp:RequiredFieldValidator>
<asp:RangeValidator ID="valQuantityRange" runat="server" ControlToValidate="txtQuantityDelivered"
ErrorMessage="* Invalid" MinimumValue="0" Type="Double" CultureInvariantValues="True"
Display="Dynamic"></asp:RangeValidator>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label5" runat="server" Text='<%# Bind("QuantityDelivered") %>'></asp:Label>
</ItemTemplate>
<HeaderStyle HorizontalAlign="Right" />
<ItemStyle HorizontalAlign="Right" />
</asp:TemplateField>
<asp:TemplateField ShowHeader="False">
<EditItemTemplate>
<table class="BorderlessTable">
<tr>
<td>
<asp:Button ID="Button1" runat="server" CausesValidation="True" CommandName="Update"
Text="Update" />
</td>
<td>
<asp:Button ID="Button2" runat="server" CausesValidation="False" CommandName="Cancel"
Text="Cancel" />
</td>
</tr>
</table>
</EditItemTemplate>
<ItemTemplate>
<table class="BorderlessTable">
<tr>
<td>
<asp:Button ID="Button1" runat="server" CausesValidation="False" CommandName="Edit"
Text="Edit" />
</td>
<td>
<asp:Button ID="Button2" runat="server" CausesValidation="False" CommandName="Delete"
Text="Delete" />
</td>
</tr>
</table>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
最后jQuery我用来将文本框转换为日期选择器（在用户控件中）：
//Configure dates when the page is loaded
$(document).ready(configureDates);
//Add handler toend request
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_endRequest(configureDates);
//Configure all date picker text boxes
function configureDates() {
var datePickers = $('.datePicker');
if ($(datePickers).length > 0) {
$(datePickers).datepicker({ dateFormat: "dd/mm/yy" }); <--- ERROR IS HERE
}
}
有人能看出这有什么问题吗？我认为这可能与jQuery文件的路径有关，具体取决于当前上下文是在pages文件夹还是web控件文件夹中。
答案 0 :(得分：1)
使用ResolveUrl作为脚本和css引用：
<link href='<%= Page.ResolveUrl("~/App_Themes/Default/Style.css")%>' rel="stylesheet" type="text/css" />
<link href='<%= Page.ResolveUrl("~/JavaScripts/jquery-ui.css")%>' rel="stylesheet" type="text/css" />
<script src='<%= Page.ResolveUrl("~/JavaScripts/jquery.min.js")%>' type="text/javascript"></script>
<script src='<%= Page.ResolveUrl("~/JavaScripts/jquery-ui.min.js")%>' type="text/javascript"></script>
//Configure all date picker text boxes
function configureDates() {
$('.datePicker').datepicker("option", "dateFormat", "dd/mm/yy");
}
答案 1 :(得分：0)
$(datePickers)是一个列表。应该做什么就像
$('.datePicker').each(function(idx, obj) {
$(obj).datepicker({ dateFormat: "dd/mm/yy" });
});
答案 2 :(得分：0)
我认为应该是：
if（datePickers.length＆gt; 0）{ datePickers.datepicker（{dateFormat：“dd / mm / yy”}）;