Cancelling TextChange Client-Side and Re-Entering the Same Text

[David]

In my client-side event handler for the OnClientTextChange event, I've added code that under certain circumstances sets the text of the combobox to the empty string and cancels the server-side TextChanged event by calling client-side EventArgs.set_cancel(true).  This has created the following situation:

1. User enters some text in the combobox, say "David", and hits enter, firing the search
2. The user performs the action in the combo that causes my client-side code to cancel the server-side TextChanged event
3. The user then enters "David" in the combobox again and hits enter, but neither the client- or server-side TextChanged events fire.

I think that cancelling the server-side TextChanged event is keeping the text as "David" even though I'm setting the text to the empty string in the OnClientTextChange event and the combobox properly shows the empty string.  The combobox still thinks its text is "David" and is thus not re-firing the search.  If I delete the last "d", everything fires as expected.

Is this supposed to work this way, and if so, could someone suggest a workaround?

[Veselin Vasilev]

Hi David,

I could not reproduce the problem using the following code:

<telerik:RadComboBox ID="c1"
    AllowCustomText="True"
    OnClientTextChange="(function(sender, e){ alert('canceling'); e.set_cancel(true); sender.set_text('');})"
    AutoPostBack="True"
    runat="server"
    ontextchanged="c1_TextChanged"
    Skin="Forest">
    <Items>
        <telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem1"
            Value="RadComboBoxItem1" />
        <telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem2"
            Value="RadComboBoxItem2" />
        <telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem3"
            Value="RadComboBoxItem3" />
        <telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem4"
            Value="RadComboBoxItem4" />
        <telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem5"
            Value="RadComboBoxItem5" />
    </Items>
</telerik:RadComboBox>

protected void c1_TextChanged(object sender, EventArgs e)
{
    Response.Write(c1.Text);
}

Here are the steps I perform:
1. Type David in the combo
2. Hit Enter
3. I see the alert and the text is cleared.
4. I type David again and hit Enter - I see the alert again - so the OnClientTextChange event is firing.

What is different in your case? Can you try with the latest build?

All the best,
Veselin Vasilev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Ivan]

Hi there,
I have a similar problem to the problem David posted. I tried your code but it only shows the alert and immediately posts to the server that is it doesn't cancel the event. Have you tried harder to reproduce the problem or you didn't want to lose your time with it?
Regards,
Ivan

[Veselin Vasilev]

Hello Ivan,

I tried the code I supplied using the latest version. Please download it and try with it.

Regards,
Veselin Vasilev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Ivan]

Hi Veselin,
Sorry to say but I am using the latest version of the Rad controls (2009.2.701.35). I just thought what if I test this code in Internet Explorer. Yep it worked. But did you try your code in Firefox or Opera? I can only say it doesn't work on my Firefox and my Opera. And here is my problem: I have a combo box and a text box. I select an existing item or type a new one in the combo box. The text in the combo box should appear in the text box.

<telerik:RadComboBox ID="RadComboBox1" runat="server" AllowCustomText="true" MarkFirstMatch="false"
        OnClientTextChange="textChanged" OnClientSelectedIndexChanged="textChanged">
        <Items>
            <telerik:RadComboBoxItem Text="FirstItem" runat="server" Value="FirstItem" />
            <telerik:RadComboBoxItem Text="SecondItem" runat="server" Value="SecondItem" />
            <telerik:RadComboBoxItem Text="ThirdItem" runat="server" Value="ThirdItem" />
        </Items>
    </telerik:RadComboBox>
    <asp:TextBox ID="TextBox1" runat="server" TextMode="SingleLine"></asp:TextBox>
    <script type="text/javascript">
        function textChanged(sender, args) {
            $get('<%= TextBox1.ClientID %>').value = sender.get_text();
        }
    </script>

Try these steps:
1. Select "FirstItem". It is displayed in the text box.
2. Erase "FirstItem" and type "2". "2" is displayed in the text box.
3. Open the drop down list of the combo box and select "FirstItem" again. "2" is still displayed in the text box.
Any help with this problem will be appreciated.
Regards,
Ivan

[Simon]

Hello Ivan,

This is a bug in RadComboBox which you can work around by putting the following script on your page (after the ScriptManager control):

Sys.Application.add_init(function() {
    var $p = Telerik.Web.UI.RadComboBox.prototype;
    $p._oPerformSelect = $p._performSelect;
    $p._performSelect = function(item, e) {
    if (!item) this.set_selectedItem(null);
        this._oPerformSelect(item, e);
    };
});

I logged the bug in our bug-tracking system and updated your Telerik points for the report.

Greetings,
Simon
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Ivan]

Thanks, it works, but I got an answer for my problem a few days ago through a support ticket.
Best regards,
Ivan