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

4 posts, 0 answers
  1. Bharath
    Bharath avatar
    6 posts
    Member since:
    Dec 2013

    Posted 22 Jan 2014 Link to this post

    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
  2. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2565 posts

    Posted 22 Jan 2014 Link to this post

    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!
  3. Kendo UI is VS 2017 Ready
  4. Bharath
    Bharath avatar
    6 posts
    Member since:
    Dec 2013

    Posted 22 Jan 2014 Link to this post

    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
  5. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2565 posts

    Posted 23 Jan 2014 Link to this post

    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!
Back to Top
Kendo UI is VS 2017 Ready