CODEWITHSUNDEEP
asp.netajaxupdatepanel
Iralda Mitro
Iralda Mitro

Reputation: 7356

Problem with textbox inside updatepanel - not causing OnTextChanged event

I have the following situation: I have a textbox inside an ajax updatepanel. Wherever the user types in the textbox I must display a message (different message that depends on the user typed data). 

     <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always">
        <ContentTemplate>
            <asp:TextBox ID="txtMyTexbox" runat="server" Width="500px" OnTextChanged="txtMyTexbox_TextChanged" AutoPostBack="true"></asp:TextBox>
            <br />
            <asp:Label ID="lblMessage" runat="server" CssClass="errorMessage" Visible="false">Hello World</asp:Label>
         </ContentTemplate>
            <Triggers>
             <asp:AsyncPostBackTrigger ControlID="txtMyTexbox" />
            </Triggers>
      </asp:UpdatePanel>

In server side I have written the following at page load

ScriptManager.GetCurrent(this).RegisterAsyncPostBackControl(txtMyTexbox);

and the method like this

protected void txtMyTexbox_TextChanged(object sender, EventArgs e)
    {           
            if (.....)
            {
                lblMessage.Visible = false;
            }
            else
            {
                lblMessage.Visible = true;
            }            
    }

My problem now is that: when the user types in the textbox it doesn't cause OnTextChanged event.

Am I missing something?

Upvotes: 12

Views: 29653

Answers (6)

Samar jann
Samar jann

Reputation: 1

The Control which id is used in AsyncPostBackTrigger must be outside the update Panel(that cause to fire the Async call) like this:

<tr>
    <td colspan="4"><asp:Label ID="lblEnter_Successfully"  Text="Enter Record SuccessFully" runat="server" Visible ="false" ForeColor ="Blue" Font-Size ="Larger" Font-Bold ="true"></asp:Label>
    </td>
</tr>                                           
</table>                
</ContentTemplate>

  <Triggers>
     <asp:AsyncPostBackTrigger ControlID = "Button_Save" EventName ="Click"/>
  </Triggers>                       

</asp:UpdatePanel>
            <table>
              <tr>
                <td width = "472px" align ="right">             
                    <asp:Button ID="Button_Save" runat="server" Text="Save"  OnClientClick ="return URLValidation();"/>
                    <asp:Button ID="Button_Clear" runat="server" Text="Clear"/>
                </td>
              </tr>
            </table>

Upvotes: 0

Mathew M Mathew-Nest
Mathew M Mathew-Nest

Reputation: 31

its strnage to know that even after adding update panel / AsyncPostBackTrigger , TextBox ChangeEvent doesn't work properly. Some time its works and some times it not..Since its is Asychronous call, we need to some time refresh, or wait or unpredictable , Hopes microsoft will come up with competent one.. Below are easy way to check user name pretty good

------ Under Page_Load - aspx.cs -----------------------

this.TextBox1.Attributes.Add("onKeyUp", "fnUNameSubmit(this);");

-------in aspx -add script ---------------------------------------

<script language="javascript" type="text/javascript">

function fnUNameSubmit(urInput) {   
var inpt= urInput.value;
if (inpt.length > 21) { 
document.getElementById('<%= TextBox1.ClientID %>').style.backgroundColor = "green";
document.form1.submit();  // This is only trick we use here..
}
else {
document.getElementById('<%= TextBox1.ClientID %>').style.backgroundColor = "red";
}
  }
</script>

-------in aspx -add script --------------------------------------- ----------------aspx.cs ------------------- if (TextBox1.Text.Length > 21) { CheckUsrName(); Label2.Text = ""; } else { Label2.Text = "Length is less than 21"; //lets do some stuff..bla..bla } ------------------------------------------------- CheckUsername()

public void CheckUsrName() {

  Call dB values

}

Upvotes: 1

user240141
user240141

Reputation:

a workaround check textbox - causesvalidation property and set it to true

Upvotes: 0

Christoffer Lette
Christoffer Lette

Reputation: 14816

I'm not sure that your problem has anything to do with the UpdatePanel.

In fact, the TextChanged event doesn't fire while typing. It will only fire after the textbox loses focus. This happens directly if AutoPostBack is set to True, or when the next postback occurs. Please see the docs for the AutoPostBack property and the TextChanged event.

Afaik, your best bet is probably to handle the keyup event in javascript.

Here's a simple jQuery example:

$(document).ready(function() {
    $(':text[id$=YourTextBox]').keyup(function() {
        if ($(this).val() === "your special value") {
            $('span[id$=YourLabel]').css('visibility', 'visible');
        }
        else {
            $('span[id$=YourLabel]').css('visibility', 'hidden');
        }
    });
});

Upvotes: 6

Michael Kniskern
Michael Kniskern

Reputation: 25260

Set the EventName property for your txtMyTexbox AsyncPostBackTrigger to TextChanged

<Triggers>             
    <asp:AsyncPostBackTrigger ControlID="txtMyTexbox" EventName="TextChanged" />            
</Triggers>

Other sugguestion:

Have you tried looking at the AutoComplete control that is part of the AjaxControlToolKit? Its behaves the same way you want your solution to behave.

Upvotes: 5

womp
womp

Reputation: 116977

You should not be using RegisterAsyncPostBackControl for your TextBox. That method is really only for use for controls that reside outside of UpdatePanels. I would try removing that line of code and seeing what happens.

See this for more info: http://msdn.microsoft.com/en-us/library/system.web.ui.scriptmanager.registerasyncpostbackcontrol.aspx

Upvotes: 0

Related Questions