ajax 模式弹出窗口上的 Ajax 日历扩展器问题？答案

【问题标题】：Ajax calendar extender issue on ajax modal popup?ajax 模式弹出窗口上的 Ajax 日历扩展器问题？
【发布时间】：2019-01-20 14:15:26
【问题描述】：

我在 asp.net 网络表单的 ajax 模式弹出窗口上添加了 ajax 日历扩展器，但它不显示月份和年份。

<asp:TextBox ID="txtdateCalendar" runat="server" Width="220px" ></asp:TextBox>
<asp:ImageButton ID="imgPopup" runat="server" ImageUrl="https://cdn4.iconfinder.com/data/icons/small-n-flat/24/calendar-alt-512.png" Height="20px" Width="30px"  /> 
<ajaxToolkit:CalendarExtender ID="CalendarBirth" TargetControlID ="txtdateCalendar" CssClass="cal_Theme1" PopupButtonID="imgPopup" Format="dd/MM/yyyy" runat="server"></ajaxToolkit:CalendarExtender>

【问题讨论】：

你有什么问题？
这很可能是与 css 相关的问题，因为月份名称被截断并且无法正确显示。您可以使用浏览器开发工具检查月份名称行并尝试调整边距或填充
我确实检查过，但它的显示样式 { top:139 } 也没有改变，是否可以在日历扩展器标签中添加样式？
@KiranGirase 您可以指定CssClass 属性来应用您的自定义样式。
您看到的 139 或 -139 来自 Javascript。 AjaxControlToolKit 似乎被硬编码为 139 像素的高度，每次单击标题时都会将 .ajax__calendar_days 表、.ajax__calendar_months 表、.ajax__calendar_years 表中的一个或多个设置为 0、139 或 -139。我正在研究如何自己覆盖它。

标签： asp.net ajaxcontroltoolkit

【解决方案1】：

尽可能少地解决这个问题：

1) 打开 网站\管理 NuGet 包 菜单项。

2) 在Browse

下安装AjaxControlToolkit.StaticResources

3) 向 ScriptManager 控件添加 ScriptReference

<asp:ScriptManager runat="server"> <Scripts> <asp:ScriptReference Path="~/Scripts/AjaxControlToolkit/Bundle" /> </Scripts> </asp:ScriptManager>

4) 将 Styles.Render 表达式添加到元素中。

<asp:PlaceHolder runat="server"> <%:System.Web.Optimization.Styles.Render("~/Content/AjaxControlToolkit/Styles/Bundle") %> </asp:PlaceHolder> <link href="../../include/css/ajax-calendar-fix.css" rel="stylesheet" />

5) 在项目的解决方案资源管理器中，找到项目根目录中的 Scripts\AjaxControlToolkit\Release 文件夹。

6) 打开 Calendar.js 文件并搜索this._width=。

7) 将高度和宽度更改为您为 .ajax__container 高度和宽度设置的值。（它们将紧挨着。）

注意事项：

A) 在我的例子中，我们使用的是 git，所以我还将 Calendar.js 文件添加到源代码控制中。

B) 我在其他页面控件上也有一些冲突的样式，因此我必须使一些选择器更具体，以使边框和背景正确显示。

.ajax__calendar .ajax__calendar_hover .ajax__calendar_today 变成了 .ajax__calendar_custom td.ajax__calendar_hover div.ajax__calendar_today 例如。

【讨论】：