asp.net 计时器事件在键入时触发文本框onchange

fhg3lkii  于 5个月前  发布在  .NET
关注(0)|答案(2)|浏览(76)

我有一个项目,它有一个更新计时器,可以做一些后台的东西,主要是检查活动。我们需要添加一些有onChange事件的文本框。但是,在键入时,计时器事件将触发文本框。
我认为将每个人隔离在自己的更新面板中不会有任何帮助。
计时器事件不能被删除,所以这是关闭的表...我需要照顾的问题上的文本框只。任何建议将不胜感激!
这里是完整的代码.基本上做了一个新的项目作为一个简单的样本,因为真实的项目是巨大的!

<body>
<form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="conditional" ChildrenAsTriggers="false">
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="tick" />
        </Triggers>
        <ContentTemplate>
            <asp:Timer ID="Timer1" runat="server" Interval="3000" />
            <div>
                <asp:Label ID="lblTimer" runat="server" Text="0" />
            </div>
        </ContentTemplate>
    </asp:UpdatePanel>

    <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="TextBox1" EventName="TextChanged" />
        </Triggers>
        <ContentTemplate>
            <div>
                <asp:TextBox ID="TextBox1" runat="server" />
                <asp:Label ID="lblNewText" runat="server" Text="-" />
            </div>
        </ContentTemplate>
    </asp:UpdatePanel>
</form>

个字符
End Class

n3schb8v

n3schb8v1#

你不太可能得到这个设置与更新面板工作
首先,文本框的onchange事件只在你退出标签时触发。所以尝试连接并使用onchange不会工作得那么好。
接下来,如果有问题的文本框遭受了回发(在面板内或不在面板内),那么页面当然会刷新,光标位置会重新设置到开始位置。因此,当这种回发发生时,尝试在文本框中键入内容根本无法正常工作。
总之,这意味着,如果你要有一个文本框,允许打字,而不是遭受光标重置,那么文本框真的不能成为任何回邮的一部分,是吗?
请记住,更新面板确实会触发页面生命周期。这包括每次页面加载事件背后的代码运行。因此,请记住这一点,因为页面加载确实会触发。因此,尽管更新面板会给人一种页面回发没有发生的错觉,但情况并非如此!
更新面板的正确术语是我们所说的“部分回发”。换句话说,只有更新面板中的内容会回发到服务器。* 但是,请不要搞错,这是一个完整的有效页面生命周期,并且如上所述,包括每次触发的页面加载事件(然后说按钮代码存根在页面加载后运行)。*
因此,您可以做的是将文本框留在更新面板之外,然后触发更新面板运行(更新标签)。
所以,这是可行的(我假设这里是jQuery)。

<asp:TextBox ID="TextBox1" runat="server"
           onkeyup="$('#mybut').click()" />

        <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional" >
            <ContentTemplate>
                <div>
                    <asp:Button ID="mybut" runat="server" Text="Button"  
                        ClientIDMode="Static" OnClick="mybut_Click"  style="display:none" />

                    <asp:Label ID="lblNewText" runat="server" Text="-" />

                </div>
            </ContentTemplate>
        </asp:UpdatePanel>

字符串
因此,对于文本框中的每个选项,我们使用onkey up(因为onchange需要文本框外的选项卡才能查看文本框的内容,更重要的是,不需要文本框外的选项卡)。
验证码:

Protected Sub mybut_Click(sender As Object, e As EventArgs)

    lblNewText.Text = TextBox1.Text

End Sub


所以,上面的工作,并允许输入.由于文本框是在更新面板外,然后回发只包括更新面板中的内容,因此文本框的光标位置不会改变或得到混乱.
请记住,由于文本框位于更新面板的外部,因此控件是只读的(您不能在更新面板的代码后面更改控件,但您可以从外部控件读取值)。
你建议不要考虑计时器(这里的位置不好,你需要在这里的方法上有一些灵活性)。
您可以让/享受计时器UP在递增标签值处滴答作响。
但是,对于您的文本框?
我建议你采用JavaScript和客户端代码。简单的问题是,在一天结束时,如果你允许在文本框中输入,它不能被回发,并遭受页面生命周期。如果文本框确实如此,那么正如所指出的,你不妨转储所有更新面板,因为你看到的任何更新面板都不会有任何不同,如果你没有首先引入任何更新面板!
因此,上面的概念验证代码确实允许更改标签,因此面板外部的文本框可以正常工作。
你最好在这里介绍客户端JavaScript。所以,虽然我认为更新面板是webforms最大的功能之一,但如果你打算尝试重新处理,它们实际上并不起作用。
你也没有提到/注意/建议/暗示你的最终目标是什么?
是否在键入文本框时进行搜索?
互联网上有很多这样的例子,很多例子都使用了jQuery.UI和“自动完成”
然而,如果你不喜欢写JavaScript,那么你可以从ajaxtoolkit中采用一个很好的自动完成工具。采用aj toolkit的自动完成工具,这样你就不必写任何JavaScript(当然,幕后的aj toolkit会自动连接事情,并且这样做你看不到也不必担心的JavaScript例程)。
如上所述,由于文本框在UP之外,因此它不会回发到服务器,因此不会出错。
因此,引入带有计时器的第二个更新面板应该可以在上述设置中正常工作。
所以,我们有这个:

<asp:TextBox ID="TextBox1" runat="server"
           onkeyup="$('#mybut').click()" />

        <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional" >
            <ContentTemplate>
                <div>
                    <asp:Button ID="mybut" runat="server" Text="Button"  
                        ClientIDMode="Static" OnClick="mybut_Click"  style="display:none" />

                    <asp:Label ID="lblNewText" runat="server" Text="-" />

                </div>
            </ContentTemplate>
        </asp:UpdatePanel>

        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="conditional" >
            <ContentTemplate>
                <asp:Timer ID="Timer1" runat="server" Interval="1000" />
                <div>
                    <asp:Label ID="lblTimer" runat="server" Text="0" />
                </div>
            </ContentTemplate>
        </asp:UpdatePanel>


因此,我们看到这种效果:
x1c 0d1x的数据
所以,在一天结束的时候,你最好使用客户端JavaScript来连接它。更新面板将为你带来一些真实的酷的功能,并且通常消除了编写和采用JavaScript和对服务器代码的apache调用的需要,但是正如所指出的,对于apache处理,它们相当难。
我认为你应该概述你的目标,以及你试图在这里完成的事情,而不是跺脚说你必须使用定时器控件和更新面板。你不必这样做,公平地说,定时器控件的问题可能不是一个真正的问题。
到目前为止,我们的目标是在文本框中进行文本处理,这是更新面板在这里无法帮助您的事情。

编辑:用户未尝试进行重复处理

好吧,从某种意义上说,这是一个简单的公园散步。
只需删除标记中所有的触发器垃圾(您不需要这些触发器)。
所以,这是100%正常工作的:

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="conditional">
            <ContentTemplate>
                <asp:Timer ID="Timer1" runat="server" Interval="1000" />
                <div>
                    <asp:Label ID="lblTimer" runat="server" Text="0" />
                </div>
            </ContentTemplate>
        </asp:UpdatePanel>


        <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <div>
                    <asp:TextBox ID="TextBox1" runat="server"
                        OnTextChanged="TextBox1_TextChanged"
                        AutoPostBack="true">
                    </asp:TextBox>
                    <br />

                    <asp:Label ID="lblNewText" runat="server" Text="-" />

                </div>
            </ContentTemplate>
        </asp:UpdatePanel>


后面的代码是:

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

End Sub

Protected Sub Timer1_Tick(sender As Object, e As EventArgs) Handles Timer1.Tick
    lblTimer.Text += 1
End Sub

Protected Sub TextBox1_TextChanged(sender As Object, e As EventArgs)

    lblNewText.Text = TextBox1.Text

End Sub

运行时的结果如下所示:


编辑3:textbox不回发

好吧,我可以做一个更长的解释,但帖子是100%正确的-文本框是由于定时器更新面板(一个单独的面板)回发。考虑到这一点,这现在是有意义的。
因此,我建议现在将此代码用于文本框更新面板:

<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional"
            >
            <ContentTemplate>
                <div>
                    <asp:TextBox ID="TextBox1" runat="server"
                        onChange="mybutclick()"
                        >
                    </asp:TextBox>
                    <br />

                    <asp:Label ID="lblNewText" runat="server" Text="-" />
                    <asp:Button ID="cmdTextChange" 
                        runat="server" Text="change button"
                        ClientIDMode="Static"
                        OnClick="cmdTextChange_Click"                            
                        />

                    <script>
                        function mybutclick() {

                            $('#cmdTextChange').click()
                        }

                    </script>

                </div>
            </ContentTemplate>
        </asp:UpdatePanel>


因此,当用户从文本框中跳出来时,后面的代码现在变成了一些按钮代码。因此:

Protected Sub cmdTextChange_Click(sender As Object, e As EventArgs)

    Debug.Print("but click - for text change")
    lblNewText.Text = TextBox1.Text

End Sub

kninwzqo

kninwzqo2#

我不确定这是否是最好的答案,但这是我想出的一个快速解决方案。基本上是一个包含文本框和隐藏按钮的用户控件。在单击按钮的文本框上有一个JS onchange事件,然后引发一个事件。我现在正在测试几个点....仍然在处理标签索引问题,但它并不重要。
首页:

<%@ Control Language="vb" AutoEventWireup="false" CodeBehind="TextboxUC.ascx.vb" Inherits="Wise.TextboxUC" %>
<asp:TextBox ID="TextBox1" runat="server" /><asp:Button ID="btnSubmit" runat="server" style="display:none" />

字符串
代码隐藏:

Public Class TextboxUC
    Inherits System.Web.UI.UserControl

    Public Event OnTextChanged As EventHandler

    Public Property [text] As String
        Get
            Return TextBox1.Text
        End Get
        Set(value As String)
            TextBox1.Text = value
        End Set
    End Property

    Public Property MaxLength As Integer
    Public Property Columns As Integer

    Private Sub UCTextbox_Load(sender As Object, e As EventArgs) Handles Me.Load
        If IsPostBack = False Then
            TextBox1.Attributes.Add("onchange", "document.getElementById('" & btnSubmit.ClientID & "').click();")
            If Columns > 0 Then TextBox1.Columns = Columns
            If MaxLength > 0 Then TextBox1.MaxLength = MaxLength
        End If
    End Sub

    Private Sub btnSubmit_Click(sender As Object, e As EventArgs) Handles btnSubmit.Click
        TextBox1.Focus()
        RaiseEvent OnTextChanged(ID, e)
    End Sub

    Public Overrides Sub Focus()
        TextBox1.Focus()
    End Sub
End Class

相关问题