Remove From My Forums

how to make textchanged event works when textbox place in update panel?

Question
0

Sign in to vote

User-1585918428 posted

Dear All Experts,

Good day.

I have a textboxt which I set the autopostback to true. And when there is textchanged in the textbox, the textchanged event will fire and execute as per the codes i wrote.
It works well when i debug, however the autopostback make the webpage refresh each time the textchanged event is fired.

To prevent the page refresh, I move the textbox into a update panel. I found the textchanged event is not firing after I move the textbox into updatepanel.

What should i do to make the textchanged event fire?

thanks in advance for advice.

regards
garf

Tuesday, June 26, 2018 8:41 AM

All replies

0

Sign in to vote

User-1171043462 posted

TextChanged event will fire in UpdatePanel also provided there is no JavaScript error or some code is preventing PostBack.

Tuesday, June 26, 2018 8:53 AM

User632428103 posted

Hello all,

@garfchong => why don't you use jquery change event ?

here is it a little sample :

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="../../../Scripts/jquery-2.0.3.js"></script>
    <script type="text/javascript">
        $(document).ready(function ()
        {
            //
            $('#txtInput').keyup(function () {
                alert($('#txtInput').val());
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        Enter your name :
        <input type="text" id="txtInput">
    </form>
</body>
</html>

Tuesday, June 26, 2018 9:24 AM

0

Sign in to vote

User-1585918428 posted

TextChanged event will fire in UpdatePanel also provided there is no JavaScript error or some code is preventing PostBack.

But I'm using vb...

Tuesday, June 26, 2018 10:01 AM

User-1585918428 posted

Hello all,

@garfchong => why don't you use jquery change event ?

here is it a little sample :

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="../../../Scripts/jquery-2.0.3.js"></script>
    <script type="text/javascript">
        $(document).ready(function ()
        {
            //
            $('#txtInput').keyup(function () {
                alert($('#txtInput').val());
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        Enter your name :
        <input type="text" id="txtInput">
    </form>
</body>
</html>

Thanks for the sample given. I'll try. In fact, is it possible to do it using vb code? thanks

Tuesday, June 26, 2018 10:02 AM

0

Sign in to vote

User-1171043462 posted

Share your code

Tuesday, June 26, 2018 10:12 AM

User632428103 posted

for me it's not a best solution to use textChanged as event on code behind ..because the page is refresh but here is it a little sample

<asp:UpdatePanel ID ="updt1" runat ="server" >
       <ContentTemplate >
       <asp:TextBox ID="txt" runat ="server" ></asp:TextBox>
       </ContentTemplate>
       <Triggers >
       <asp:AsyncPostBackTrigger ControlID ="txt" EventName ="TextChanged" />
       </Triggers>
       </asp:UpdatePanel>

Protected Sub txt_TextChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles txt.TextChanged
       Response.Write("Hello asp net")
   End Sub

the best solution for me it's to used jquery change event more efficiant ..

Tuesday, June 26, 2018 1:54 PM

0

Sign in to vote

User-1171043462 posted

You are using VB, but UpdatePanel uses Javascript to update data without PostBack

Tuesday, June 26, 2018 2:06 PM

User-330142929 posted

Hi Garfchong,

According to your description, I think you may forget to set AutoPostBack=true. In some cases it will not work correctly.

Besides, why do you want to use Reponse.write(), do you want to register the script to the frontend? What needs to be mentioned is that the response.write doesn’t work here. No Postback is involved here. If you want to register the script to the frontend, I suggest you could use the following method.

Aspx.

            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>
                    <asp:TextBox ID="TextBox1" runat="server" AutoPostBack="True"></asp:TextBox>
                    <br />
                </ContentTemplate>
                <Triggers>
                    <asp:AsyncPostBackTrigger ControlID="TextBox1" EventName="TextChanged" />
                </Triggers>
            </asp:UpdatePanel>

Code behind.

    Protected Sub TextBox1_TextChanged(sender As Object, e As EventArgs) Handles TextBox1.TextChanged
        'Response.Write("Hello asp net")
        ScriptManager.RegisterClientScriptBlock(UpdatePanel1, Me.GetType(), "", "alert('" + TextBox1.Text + "')", True)
 
End Sub

How it works. Please note the upper left corner refresh bar.

Feel free to let me know if you have any question.

Best Regards,

Abraham

Wednesday, June 27, 2018 7:39 AM

0

Sign in to vote

User-1585918428 posted

Hi Abraham,

Thanks for comment. Actually I didn't want to use response.write. Instead, after user keyin the textbox, there will be series of code to read from database and compare the data in database.

I'm using Microsoft visual web developer, and I do set the autopostback to true. Everything work well when the textbox is not in update panel. and it doesnt work if i locate the textbox in update panel... i do include the <trigger> tag but it still not working..

wondering what went wrong.

thanks and regards
Garf

Saturday, June 30, 2018 4:19 PM

User-1171043462 posted

 <asp:TextBox ID="txt" runat ="server" ></asp:TextBox>

AutoPostBack="True" is missing

 <asp:TextBox ID="txt" runat ="server" AutoPostBack= "True" ></asp:TextBox>

Saturday, June 30, 2018 6:33 PM

Asked by:

how to make textchanged event works when textbox place in update panel?

Question

All replies