Multi select only as a dropdown selector and user input disabled.

[Bharath]

Hi,

I am new to Kendo, I am facing few issues in fulfilling requirement w.r.t to Kendo UI multiselect.

1.       I am using Kendo UI Multiselect. I want the multiselect widget to act only as a drop down i.e., on click on the widget, it has to show the list of options in the dropdown and the user should not be able to enter text in the multiselect text field. User can only select the option from the dropdown.
Is this possible?

2.       Should the dataValueField be unique?
- If I have dataTextField as {'test1','test2'} and dataValueField as {'test','test'}
- The multiselect gets populated with test1 twice.

Thanks,
Bharath

[Kiril Nikolov]

Hi Bharath,

You can use the keypress event in order to prevent typing values from the keyboard. Please check the following example:

http://jsbin.com/AHEdAbeJ/1/edit

As for your second question - I am not really sure what you configuration is, but using objects with same values should work (also added to the example).

Regards,
Kiril Nikolov
Telerik

[Bharath]

Hi Kiril,

Thanks for the update.

1. keypress event works, but I am not able to remove the cursor also from the multiselect. As per the requirement, even the cursor(text input cursor: "I") should not be available. It should just be a dropdown where the user can select the option.

2. I am getting data from URL and passing it as an object to "value" in multiselect example

value : getFieldValues()  //Here in the function I return the object of the values that I set to the multiselect on initialisation.

example:
[Object {PLACE="Bangalore", TYPE="city"}, Object { PLACE="Anderson", TYPE="city"}]   is the returned object from getFieldValues().

The values in the multiselect are set twice to "Bangalore". Please let me know why is this happening?

Please find the example w.r.t to the issue

http://jsbin.com/asAdurO/1/edit

Thanks,
Bharath

[Kiril Nikolov]

Hi Bharath,

When you remove the cursor then the user will not be able to click inside the multiselect in order to show the dropdown and select items. If you are talking about the caret inside the input, then you can just set the element to be read only as in this example:

http://jsbin.com/amimuxap/1/edit

As for your other question - this behavior is expected as the value method looks for the value property in the objects and assigns the first that is found.

Regards,
Kiril Nikolov
Telerik