gpt4 book ai didi

javascript - 在数据列表中重复jquery datepicker

转载 作者:行者123 更新时间:2023-11-28 08:25:41 27 4
gpt4 key购买 nike

我有jquery日期选择器工作,但它只适用于数据列表的第一个框。我在让日期选择器在数据列表的所有文本框中工作时遇到问题。

这是我的 asp.net 网站顶部的内容,就在 <head> 之后

</head>

<body oncontextmenu="return false" onload="PageLoad()">


<form id="form1" runat="server" >



<asp:ScriptManager ID="sm1" runat="server" />


<link rel="stylesheet" href="../development-bundle/themes/base/jquery.ui.all.css">
<script src="../development-bundle/jquery-1.10.2.js"></script>
<script src="../development-bundle/ui/jquery.ui.core.js"></script>
<script src="../development-bundle/ui/jquery.ui.widget.js"></script>
<script src="../development-bundle/ui/jquery.ui.datepicker.js"></script>
<link rel="stylesheet" href="../development-bundle/demos/demos.css">

<script type="text/javascript">
$(function () {

$("#datepicker").datepicker();



});



</script>

这是我如何在数据列表中调用日期选择器

                        <asp:Panel ID="Panel3" runat="server" ><span style="background-color: #">
<asp:DataList ID="DataList2" runat="server" CellPadding="2" oncancelcommand="DataList2_CancelCommand"
onupdatecommand="DataList2_UpdateCommand" RepeatDirection="Horizontal"
Width="400px" ForeColor="Black" BackColor="LightGoldenrodYellow"
BorderColor="Tan" BorderWidth="1px" EnableTheming="False">
<AlternatingItemStyle BackColor="PaleGoldenrod" Width="400px" />
<EditItemStyle Width="400px" />
<FooterStyle BackColor="Tan" Width="400px" />
<HeaderStyle BackColor="Tan" Font-Bold="True"
Width="400px" />
<ItemStyle Width="400px" Wrap="True" />
<ItemTemplate>



Date: <input type="text" id="datepicker"/>


</ItemTemplate>
<SelectedItemStyle BackColor="DarkSlateBlue" ForeColor="GhostWhite"
Width="350px" />
</asp:DataList>
</span>


</asp:Panel>
</asp:Panel>
<span style="background-color: #">

数据列表中有更多属性,但我已删除它们以避免混淆。

请帮忙。谢谢

最佳答案

这里的第一个问题是您使用控制 ID,该 ID 位于中继器内并且是变化的。要捕获所有日期输入控件,您可以为它们分配一个类,然后将日期选择器应用于具有此类的所有控件。所以 html 代码将是:

<ItemTemplate>
Date: <input type="text" id="datepicker" class="mydate" />
</ItemTemplate>

第二个问题是您需要在每次 UpdatePanel 更新时运行此代码,因此不要使用 jQuery 运行,而是使用 UpdatePanel 函数在更新和启动时运行

<script> 
function pageLoad(){ $(".mydate").datepicker(); }
</script>

同时从表单中删除此声明onload="PageLoad()"

关于javascript - 在数据列表中重复jquery datepicker,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22450597/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com