代码之家  ›  专栏  ›  技术社区  ›  hyprsleepy

更新面板-文本框textChanged事件干扰下拉列表selectedIndexChanged事件

  •  1
  • hyprsleepy  · 技术社区  · 15 年前

    基础:

    • 我有一个文本框(txtDepositAmount),人们可以 将存款金额输入和 设置术语的下拉列表(ddlselectedterm)。
    • 通过这两个值,我计算 APY(lblcurrentapy)。

    规则:

    • 如果只选择其中一个值,我仍然希望更新当前APY标签并清除它。
    • 如果任一值发生更改,我希望更新当前APY并重新计算。

    问题:

    当我单击远离文本框并进入下拉菜单以选择我的术语时,下拉菜单将闪烁并关闭,因为文本框TextChanged事件刚被激发。

    我必须再次单击下拉列表才能选择任何内容!

    我是否需要更改正在查看的事件,或者是否需要将某些控件移出UpdatePanel?只有在某些业务规则发生更改时,才会发生这种情况吗?我应该放弃去看javascript吗?

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            <table width="100%">
                <tr>
                    <td align="left" style="width: 10%" class="LineAlign">
                        &nbsp;
                    </td>
                    <td align="left" style="width: 40%" class="LineAlign">
                        <asp:Label ID="lblDollarSymbol" runat="server" Text="$"/> 
                        &nbsp;
                        <asp:TextBox ID="txtDepositAmount" runat="server"
                         AutoPostBack="true" TabIndex="1" MaxLength="14" 
                         ontextchanged="txtDepositAmount_TextChanged"/>
                    </td>
                    <td align="left" style="width: 30%" class="LineAlign">
                        <asp:DropDownList ID="ddlSelectedTerm" runat="server" 
                         AutoPostBack="true" TabIndex="2"
                         onselectedindexchanged="ddlSelectedTerm_SelectedIndexChanged">
                        </asp:DropDownList>
                    </td>
                    <td align="center" style="width: 20%">
                        <asp:Label ID="lblCurrentApy" runat="server"/>
                        &nbsp;
                        <asp:Label ID="lblPercentSymbol" runat="server" Text="%"/>
                    </td>
                </tr>
            </table>
        </ContentTemplate>
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="ddlSelectedTerm" />
            <asp:AsyncPostBackTrigger ControlID="txtDepositAmount" />
        </Triggers>
    </asp:UpdatePanel>
    
    3 回复  |  直到 9 年前
        1
  •  0
  •   Jamie Treworgy    15 年前

    autopostback=“true”在您的文本框上导致了这种情况,因为这两个控件在离开文本框后都会重新加载。我怀疑有一种方法可以避免这种情况,只要它们在同一个更新面板中。

    也许您可以在文本框启动回发后将焦点设置为下拉列表,或者您可以通过将控件放置在单独的更新面板中来实现这一点。但实际上,这似乎是错误的做法。我将使用javascript(如果逻辑复杂,则使用Ajax)来更新APY。或者只需添加一个“计算”按钮…

    (编辑) 这里有一个稍微丑陋的黑客来避免Ajax,三个更新面板,并且仍然能够在逻辑服务器端进行操作。我不赞成这种方法,但它又快又脏。

    将包含计算结果的Label控件放入UpdatePanel。输入控件不需要位于UpdatePanel中。

    在更新面板(包含结果)中有一个隐藏的提交按钮:

        <asp:Button ID="DoCalculate" style="display:none;" UseSubmitBehavior="false"
     runat="server" OnClick="Recalculate()" />
    

    这应该是updatepanel的触发器。然后让您的两个输入控件使用JavaScript单击该按钮,以使部分回发到“结果”面板。下面是为下拉列表添加此javascript的代码,例如 Page_Load :

        ddSelectedTerm.Attributes.Add("onSelectedIndexChanged",
    "document.getElementByID('" + DoCalculate.ClientID + "').Click()");
    

    然后在“recalculate()”方法的第二个更新面板中放入C代码进行计算并更新标签。

    这应该有效,并且比使用3个更新面板提供更好的布局控制和更少的代码流丑陋。

        2
  •  0
  •   Escarcha    15 年前

    您只需在服务器事件中使用focus()。例如,如果您有txtbox1和txtbox2,并且在框1中写入内容后希望将焦点放在框2中,并且这两个部分都在更新面板中。

    只转到框1的TextChange事件并写入txtBox2.focus(),更新面板后,焦点将位于框2中。:)

    希望有助于…

        3
  •  0
  •   hyprsleepy    9 年前

    我划掉了更新面板,然后就做了jquery。螺丝钉微软。