This is a migrated thread and some comments may be shown as answers.

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

3 Answers 369 Views
MultiSelect
This is a migrated thread and some comments may be shown as answers.
Bharath
Top achievements
Rank 1
Bharath asked on 22 Jan 2014, 06:08 AM
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

3 Answers, 1 is accepted

Sort by
0
Kiril Nikolov
Telerik team
answered on 22 Jan 2014, 11:18 AM
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
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Bharath
Top achievements
Rank 1
answered on 22 Jan 2014, 01:22 PM
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
0
Kiril Nikolov
Telerik team
answered on 23 Jan 2014, 11:30 AM
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
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
MultiSelect
Asked by
Bharath
Top achievements
Rank 1
Answers by
Kiril Nikolov
Telerik team
Bharath
Top achievements
Rank 1
Share this question
or