Preventing user input into comboboxes

[Jeremy]

What we're trying to do is block all keyboard input into the combobox. Currently, when the user presses a key, it will attempt to index to the first person that has a name beginning with that letter despite MarkFirstMatch being set to false. When I create a new page and use this against the combobox:

$("input[name='cboSelection']").keydown(function (event) {
         event.preventDefault();
         return false;
     });
});

It works fine, as it should. The problem is that as soon as I add it to a master page, it stops working. We can't find anything that might directly conflict with it such as another keydown event, but it APPEARS to be a hierarchical problem. For instance, when I set an AlertBox to fire on the keydown event, what happens is that the combobox makes the selection THEN my event handler fires. When we don't use a master page, it happens the other way around; my event handler fires, then the combobox makes the selection

In the Silverlight version of the control, there's a property that disables keyboard input, but I have not found anything with the AJAX control that is comparable. Any insight or solutions would be appreciated. Thanks.

[Ivana]

Hello Jeremy,

If you are not loading items on demand then most probably you have the AllowCustomText property set to true. When it is set to false, the user can not type anything in the input area of the control.

If you, however, are loading items on demand (LoadOnDemand="true"), the AllowCustomText is automatically set to true and its value can not be changed. If this is your case, here is what you can do in order to overcome this behavior:

function pageLoad() {
    $find("RadComboBox1").get_inputDomElement().disabled = true;
}

<telerik:RadComboBox runat="server" ID="RadComboBox1" EnableLoadOnDemand="true" OnItemsRequested="RadComboBox1_ItemsRequested">
</telerik:RadComboBox>

This way the input area will be disabled and the user will not be allowed to type anything in it.

I hope this will help.

Greetings,
Ivana
the Telerik team

[Jeremy]

It would appear that whether or not the AllCustomText property is true or false, the combobox will still select an item. The only difference is, let's say there is items 'A', 'B', 'C' in the list. If I press 'B', it will select B. If I press 'D', then nothing will happen because there is no D in the list (no custom text). What we need it to do is not do ANYTHING regardless of what is or is not in the list.

[Kalina]

Hello,

I suppose that our previous reply was not precise enough - please excuse us for this.

At first let me explain why the simultaneous usage of Load On Demand and CheckBoxes is not supported: RadComboBox items loaded via Load On Demand are not accessible at server-side - this is made for better performance when the control deals with large amount of data.
However CheckBoxes feature need to access items at server-side and that is why by design these two features are not intended to work together.

In case you use only Load On Demand and you want to prevent user typing in RadComboBox, please set the input readOnly property in this way:

<telerik:RadComboBox ID="RadComboBox1" runat="server"
    EmptyMessage="Select a Company"
    EnableLoadOnDemand="True"
    OnClientLoad="OnClientLoad"
    OnItemsRequested="RadComboBox1_ItemsRequested" >
</telerik:RadComboBox>

function OnClientLoad(sender)
{
    sender.get_inputDomElement().readOnly = "true";
}

All the best,
Kalina
the Telerik team

[Jeremy]

Thanks for the the advice. However, I tried this and there was no change. The combobox still selects something when a key is pressed. I checked the javascript to make sure that the code was being reached, and it was reaching it just fine. We aren't using load on demand, this only happens when using a masterpage.  Very weird. We commented everything out of the masterpage just in case there was some other code in it that was causing a conflict, but that didn't help. Is this a bug?

We noticed that when we don't use a masterpage, the keypress event handler in the combobox fires our code first, then attempts to fire the control's handler; which is good because then we can catch the keystroke. When we use a masterpage, the control's handler fires first THEN our code (it's backwards) so no matter we do, we can't catch the keystroke. The code that you provided here, I understand is trying to set the control to read only when it is loaded so that typing isn't permitted. it isn't allowing custom text, which is fine, but it is still indexing/tabbing to the nearest list item which needs to stop.

Thanks

[Ivana]

Hi Jeremy,

The attached sample pages (master + content page) show how to prevent the key pressing's default behavior of the input area.

If this is not helping, I suggest to open a support ticket on this matter and send us a sample project of the troubled behavior so possible misunderstanding and discrepancies will be avoided.

Greetings,
Ivana
the Telerik team

[Jeremy]

Ok this was a bit different and worked fine, thank you. I forgot that with telerik controls, pure javascript doesn't always work. So instead of args.preventDefault(); it turned out to be args.get_domEvent().preventDefault();

:)