DataGrid EditItemTemplate内的ASP.NET JQuery日期选择器不工作

所以我有这个代码来向文本框添加一个日期选择器。它在常规文本框上运行良好，但当我尝试将其用于datagrid edititemtemplate中的文本框时，它没有任何作用。如果有人能帮忙，我将不胜感激。这是我的密码：

脚本部分是：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"
    type="text/javascript"></script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
    rel="Stylesheet" type="text/css" />
<script type="text/javascript">
    $(function () {
        $("[id$=txtMileageEntryDate]").datepicker({
            showOn: 'button',
            buttonImageOnly: true,
            buttonImage: 'http://jqueryui.com/demos/datepicker/images/calendar.gif'
        });
    });
</script>

$（函数（）{
$（“[id$=txtMileageEntryDate]”。日期选择器({
showOn:'按钮'，
buttonImageOnly:正确，
buttonImage:'http://jqueryui.com/demos/datepicker/images/calendar.gif'
});
});

我的asp.net代码是：

<asp:GridView ID="gvLogbook" runat="server" Width="823px" AutoGenerateColumns="false"
                OnRowDataBound="gvLogbook_OnRowDataBound" OnRowCancelingEdit="gvLogbook_OnRowCancelingEdit"
                OnRowDeleting="gvLogbook_OnRowDeleting" OnRowEditing="gvLogbook_OnRowEditing"
                OnRowUpdating="gvLogbook_OnRowUpdating">
                <Columns>
                    <asp:TemplateField HeaderText="Vehicle Description">
                        <ItemTemplate>
                            <asp:Label ID="lblUserVehicleIDItem" runat="server" Text='<%# Bind("VehicleDesc") %>' />
                        </ItemTemplate>
                        <EditItemTemplate>
                            <asp:Label ID="lblUserVehicleID" runat="server" Text='<%# Eval("UserVehicleID") %>'
                                Visible="false" />
                            <asp:DropDownList ID="ddlVehicleDesc" runat="server" AutoPostBack="True" />
                        </EditItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="Date">
                        <ItemTemplate>
                            <asp:Label ID="lblMileageEntryDateStatic" runat="server" Text='<%# Bind("MileageEntryDate") %>' />
                        </ItemTemplate>
                        <EditItemTemplate>
                            <asp:TextBox ID="txtMileageEntryDate" runat="server" ReadOnly="true" Text='<%# Bind("MileageEntryDate") %>' />
                            <%-- %><asp:Calendar ID="calMileageEntryDate" runat="server" SelectedDate='<%# Bind("MileageEntryDate") %>' />--%>
                        </EditItemTemplate>
                    </asp:TemplateField>
                    <asp:BoundField DataField="OdometerStart" HeaderText="Odometer Start" />
                    <asp:BoundField DataField="OdometerEnd" HeaderText="Odometer End" />
                    <asp:TemplateField HeaderText="Purpose">
                        <ItemTemplate>
                            <asp:Label ID="lblMileagePurposeIDItem" runat="server" Text='<%# Bind("MileagePurposeDesc") %>' />
                        </ItemTemplate>
                        <EditItemTemplate>
                            <asp:Label ID="lblMileagePurposeID" runat="server" Text='<%# Eval("MileagePurposeID") %>'
                                Visible="false" />
                            <asp:DropDownList ID="ddlMileagePurposeDesc" runat="server" AutoPostBack="True" />
                        </EditItemTemplate>
                    </asp:TemplateField>
                    <asp:BoundField DataField="MileageEntryComment" HeaderText="Comment" />
                    <asp:CommandField ShowInsertButton="true" ShowDeleteButton="true" ShowEditButton="true" />
                </Columns>
            </asp:GridView>

--%>

根据请求，以下是我的整个aspx文件代码：

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
CodeBehind="MileageLogbook.aspx.cs" Inherits="VehicleMilageLogbook.MileageLogbook" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"     type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"
    type="text/javascript"></script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css"
    rel="Stylesheet" type="text/css" />
<script type="text/javascript">
    $(function () {
        $("[id$=txtMileageEntryDate]").datepicker({
            showOn: 'button',
            buttonImageOnly: true,
            buttonImage: 'http://jqueryui.com/demos/datepicker/images/calendar.gif'
        });
    });
</script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<asp:Panel ID="panelAccessControl" runat="server" Visible="false">
    <asp:Panel ID="panelAddVehicle" runat="server" BorderWidth="2">
        <h2>
            Mileage Logbook</h2>
        <asp:ScriptManager ID="scriptManagerVehicle" runat="server" />
        <p>
            <asp:GridView ID="gvLogbook" runat="server" Width="823px" AutoGenerateColumns="false"
                DataKeyNames="MileageEntryID"
                OnRowDataBound="gvLogbook_OnRowDataBound" OnRowCancelingEdit="gvLogbook_OnRowCancelingEdit"
                OnRowDeleting="gvLogbook_OnRowDeleting" OnRowEditing="gvLogbook_OnRowEditing"
                OnRowUpdating="gvLogbook_OnRowUpdating">
                <Columns>
                    <asp:TemplateField HeaderText="Vehicle Description">
                        <ItemTemplate>
                            <asp:Label ID="lblUserVehicleIDItem" runat="server" Text='<%# Bind("VehicleDesc") %>' />
                        </ItemTemplate>
                        <EditItemTemplate>
                            <asp:Label ID="lblUserVehicleID" runat="server" Text='<%# Eval("UserVehicleID") %>'
                                Visible="false" />
                            <asp:DropDownList ID="ddlVehicleDesc" runat="server" AutoPostBack="True" />
                        </EditItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="Date">
                        <ItemTemplate>
                            <asp:Label ID="lblMileageEntryDateStatic" runat="server" Text='<%# Bind("MileageEntryDate") %>' />
                        </ItemTemplate>
                        <EditItemTemplate>
                            <asp:TextBox ID="txtMileageEntryDate" runat="server" Text='<%# Bind("MileageEntryDate") %>' />
                            <%-- %><asp:Calendar ID="calMileageEntryDate" runat="server" SelectedDate='<%# Bind("MileageEntryDate") %>' />--%>
                        </EditItemTemplate>
                    </asp:TemplateField>

                    <asp:BoundField  DataField="OdometerStart" HeaderText="Odometer Start" />
                    <asp:BoundField DataField="OdometerEnd" HeaderText="Odometer End" />
                    <asp:TemplateField HeaderText="Purpose">
                        <ItemTemplate>
                            <asp:Label ID="lblMileagePurposeIDItem" runat="server" Text='<%# Bind("MileagePurposeDesc") %>' />
                        </ItemTemplate>
                        <EditItemTemplate>
                            <asp:Label ID="lblMileagePurposeID" runat="server" Text='<%# Eval("MileagePurposeID") %>'
                                Visible="false" />
                            <asp:DropDownList ID="ddlMileagePurposeDesc" runat="server" AutoPostBack="True" />
                        </EditItemTemplate>
                    </asp:TemplateField>
                    <asp:BoundField DataField="MileageEntryComment" HeaderText="Comment" />
                    <asp:CommandField ShowInsertButton="true" ShowDeleteButton="true" ShowEditButton="true" />
                </Columns>
            </asp:GridView>
        </p>
    </asp:Panel>
    <asp:Label ID="lblStatus" runat="server" Text=""></asp:Label>
</asp:Panel>
<asp:Panel ID="panelAccessDenied" runat="server" Visible="true">
    <asp:Label ID="Label1" runat="server" Text="You are not authorized to view this page."></asp:Label>
</asp:Panel>

$（函数（）{
$（“[id$=txtMileageEntryDate]”。日期选择器({
showOn:'按钮'，
buttonImageOnly:正确，
buttonImage:'http://jqueryui.com/demos/datepicker/images/calendar.gif'
});
});
里程日志

--%>

---

Kevin，当我在我的页面上实现你的代码时。我有些问题，你做得不对

您正在调用的文本框Id不相同

每个模板字段为每个文本框生成不同的

ID

。因此，您需要找到另一种解决方案，以便在运行时为模板字段生成

ID

该页继承母版页，因此为模板字段的第一行生成的ID如下所示

mainContent\u grdUser\u txtMileageEntryDate\u 0

您需要将所有脚本（包括Gridview的HTML）放入代码中

---

哪一个是你最新的Jquery？恐怕我不明白为什么我被否决了。也许不管是谁做的，都会发表评论，而不仅仅是投反对票，我可以解决你认为的任何问题。否则，匿名投票是没有意义的。我没有投票，Jquery是指用来运行js代码的插件对不起，我对Jquery/Javascript非常无知。我怎么知道？你需要从这里学习谢谢你。请告诉我ID main content\u grdUser\u txtMileageEntryDate\u 0末尾的0是什么
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" />

<script type="text/javascript">
    $(function () {
        $("[id$=mainContent_grdUser_txtMileageEntryDate_0]").datepicker({
            textboxImageOnly: true,
            textboxImage: 'images/calendar.png',
            changeMonth: true,
            changeYear: true,
            dateFormat: "yyyy / mm / dd",
            yearRange: "-40:+0",
            maxDate: new Date(),

        });
    });
</script>