Question

我目前正在尝试使用Obout Calendar控件实现日期范围搜索功能。这个想法是用户可以从Obout日历中选择一个日期，然后在它旁边填充一个asp：TextBox。表单中还有其他字段，但这是破坏的字段。我在表单底部还有一个asp：Button，其功能是清除表单中的所有字段。它在后面的代码中执行此操作：

protected void btnClearFields_Click(object sender, EventArgs e)
{
    txtFrom.Text = "";
    txtTo.Text = "";
}

以下是相关的前端代码：

<table>
    <tr>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <td>
                    <asp:Label ID="lblFrom" runat="server" Text="From:"></asp:Label>
                    <br />
                </td>
                <td>
                    <asp:TextBox ID="txtFrom" runat="server"></asp:TextBox>
                </td>
                <td>
                    <obout:Calendar runat="server" ID="CalendarFrom" TextBoxId="txtFrom" StyleFolder="Calendar/styles/orbitz" ScriptPath="Calendar/calendarscript" DatePickerButtonText <IMG src='Images/calendar.gif' align=absMiddle border=0>" ShowYearSelector="true" DateMin="1/1/1900" AllowDeselect="false" DatePickerMode="true" />
                </td>
            </ContentTemplate>
        </asp:UpdatePanel>
        <asp:UpdatePanel ID="UpdatePanel2" runat="server">
            <ContentTemplate>
                <td>
                    <asp:Label ID="lblTo" runat="server" Text="To:"></asp:Label>
                </td>
                <td>
                    <asp:TextBox ID="txtTo" runat="server"></asp:TextBox>
                </td>
                <td>
                    <obout:Calendar runat="server" ID="CalendarTo" TextBoxId="txtTo" StyleFolder="Calendar/styles/orbitz" ScriptPath="Calendar/calendarscript" DatePickerButtonText <IMG src='Images/calendar.gif' align=absMiddle border=0>" ShowYearSelector="true" DateMin="1/1/1900" AllowDeselect="false" DatePickerMode="true" />
                </td>
            </ContentTemplate>
        </asp:UpdatePanel>
    </tr>
</table>

现在，我遇到的问题是，当我第一次加载页面时，一切都很顺利。我可以从日历中选择一个日期，它将按预期填写文本框。但是，如果我单击“清除字段”按钮，这会导致部分回发，那么事情就会出错。当我再次点击日历图标时（清除字段后），弹出的日期选择器的格式混乱。它的日历部分只是一个红色方块，不能选择任何日期。年份选择器栏横跨整个屏幕，更改年份对日历没有任何作用。

我在研究中找不到任何类似的问题，所以我不知道该尝试什么。我试过在整个表周围只使用一个UpdatePanel，但后来我遇到了同样的问题。我还尝试不在UpdatePanels中包含日历，这不会“破坏”日历，但它会在我的网页上放置两个新的TextBox字段（它将接受日历中的任何新值）而不清除旧日历。还尝试将按钮和包含日历的表放在同一个UpdatePanel中，但我也得到相同的红色框。

Answer 1

在this answer.中发现了一个非常类似的问题当我没有在其中包含Obout日历时，我遇到了UpdatePanel重复内容的问题。我通过将我的UpdatePanels移动到仅包围asp：TextBox来修复此问题：

<td>
    <asp:Label ID="lblFrom" runat="server" Text="From:"></asp:Label>
    <br />
</td>
<td>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            <asp:TextBox ID="txtFrom" runat="server"></asp:TextBox>
        </ContentTemplate>
    </asp:UpdatePanel>
</td>
<td>
    <obout:Calendar runat="server" ID="CalendarFrom" TextBoxId="txtFrom" StyleFolder="Calendar/styles/orbitz" ScriptPath="Calendar/calendarscript" DatePickerButtonText <IMG src='Images/calendar.gif' align=absMiddle border=0>" ShowYearSelector="true" DateMin="1/1/1900" AllowDeselect="false" DatePickerMode="true" />
</td>

这也意味着我不必更新Obout日历，这解决了原来的问题。

UpdatePanel中的Obout日历在异步回发后混乱

1 个答案: