[Solved] disableEvents() doesn't work

[Paul]

I've got trouble using the disableEvents function of the RadComboBox.

When I add a RadComboBox to my ASP.NET page, with the OnClientSelectedIndexChanged and OnClientItemsRequested event handler. To preselect a item in the combobox, I first lookup the item in the itemcollection. If the item is found, I execute disableEvents() on the combobox, select the item and after that, reenable the events with enableEvents().

Directly after I select the item, the OnClientSelectedIndexChanged-event is triggered. Because of the disableEvents() I don't expect the event to be triggered.

The following code demonstrates the bug:

<script type="text/javascript">
function onrequested(sender, eventArgs) {
  sender.disableEvents();
  sender.get_items().getItem(0).select();
  sender.enableEvents();
}
function onchange(sender, eventArgs) {
  alert("changed! new value: " + sender.get_value())
}
</script>
<script runat="server">
  Protected Sub cmbItemsRequested(ByVal sender As Object, ByVal e As EventArgs)
    cmb.DataSource = New object() {New with { .Text="Text1"}, New with { .Text = "Text2"}}
    cmb.DataBind()
  End Sub
</script>

<telerik:RadComboBox HighlightTemplatedItems="True" DataTextField="Text" DataValueField="Text" EnableLoadOnDemand="true"  OnItemsRequested="cmbItemsRequested" runat="server" id="cmb" OnClientSelectedIndexChanged="onchange" OnClientItemsRequested="onrequested">
<ItemTemplate>(<%# DataBinder.Eval(Container, "Text") %>)</ItemTemplate>
</telerik:RadComboBox>

[Rosi]

Hello Paul,

This method is for internal use and it has a different purpose. I suggest you to achieve the desired behavior by the following ways:

1.

<script type="text/javascript">
var fireTheEvent= true;
function onrequested(sender, eventArgs) {
  fireTheEvent= false;
  sender.get_items().getItem(0).select();
  fireTheEvent= true;
}
function onchange(sender, eventArgs) {
  if(fireTheEvent)
  {
     alert("changed! new value: " + sender.get_value())
  }
}

2.

<script type="text/javascript">
function onrequested(sender, eventArgs) {
  sender.set_selectedItem(sender.get_items().getItem(0));  //this will not call the OnClientSelectedIndexChanging event
}
</script>

All the best,
Rosi
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Paul]

Thank you for your reaction.

I prefer the second method because of the clean implementation (no changes to the onchange-event handler).
But if I implement this, the templated item is not highlighted.
Is there another method I can call to achieve this?

Kind regards,
Paul

[Rosi]

Hi Paul,

To highlight templated items all you need to do is to set HighlightTemplatedItems property to true.

Regards,
Rosi
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Paul]

Hi Rosi,

As you can see in my sample, I've already got that property set to true, but the item is not highligted when I open the dropdown.

The new code I'm using:

<script type="text/javascript">
function onrequested(sender, eventArgs) {
    var item = sender.get_items().getItem(0)
    sender.set_selectedItem(item);
}
function onchange(sender, eventArgs) {
  alert("changed! new value: " + sender.get_value())
}
</script>
<script runat="server">
  Protected Sub cmbItemsRequested(ByVal sender As Object, ByVal e As EventArgs)
    cmb.DataSource = New object() {New with { .Text="Text1"}, New with { .Text = "Text2"}}
    cmb.DataBind()
  End Sub
</script>

<telerik:RadComboBox HighlightTemplatedItems="True" DataTextField="Text" DataValueField="Text" EnableLoadOnDemand="true"  OnItemsRequested="cmbItemsRequested" runat="server" id="cmb" OnClientSelectedIndexChanged="onchange" OnClientItemsRequested="onrequested">
<ItemTemplate>(<%# DataBinder.Eval(Container, "Text") %>)</ItemTemplate>
</telerik:RadComboBox>

Kind regards,
Paul

[Rosi]

Hi Paul,

Please find the modfied code below:

function onrequested(sender, eventArgs) {
    var item = sender.get_items().getItem(0)
    sender.set_selectedItem(item);
    sender.set_text(item.get_text());
    item.highlight();
}

Best wishes,
Rosi
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Paul]

To get the correct state at a postback, I also added the set_value-method call.

So my method finally looks like the following:

function onrequested(sender, eventArgs) {

var item = sender.get_items().getItem(0)

sender.set_selectedItem(item);

sender.set_text(item.get_text());

sender.set_value(item.get_value());

item.highlight();

}

Thanks for your help.

Kind regards,
Paul