Wijmo AutoComplete SelectedIndex

Originally Posted 9 February 2017, 8:01 am EST

  • Originally Posted 9 February 2017, 8:01 am EST

    Hello,

    I am using Wijmo Auto Complete in my application, and assigning source to it on load. It is selecting first item from the list by default.
    How it is possible that it doesn't select any value by default. It show the place holder value.

                                          [placeholder]="'Select Rep'"
    [itemsSource]="lstDropDownRep"
    [displayMemberPath]="'Rep'"
    (isDroppedDownChanged)="RepChange(multiselRep, $event)">



    I've also used selected-index="-1" but it's not working for me. "http://fiddle.jshell.net/orfrfvxv/4/"

    I am using (Wijmo 5.20161.138 eval) ,angular 2, Typescript.
  • Reply

    Hi Sbanerjee,
    For making selection null initially for AutoComplete, you will need to set selectedIndex to -1 in directive. Please use the following code snippet for making selection null initially:

                                          [placeholder]="'Select Rep'"
    [itemsSource]="lstDropDownRep"
    [displayMemberPath]="'Rep'"
    [selectedIndex]="-1">



    Alternatively, you can also make selection null using collectionView. You will need to set collectionView's currentItem to null.

    For reference, please see the attached sample that implements both method.

    *Please install required package before running the sample.

    Thanks,
    Manish Kumar Gupta
    2017/02/AutoComplete.zip
  • Reply

    Hi Manish,

    I love this AutoComplete control in every other way, but I'm having a similar issue. I have an AutoComplete whose options change based on selections made elsewhere in our form (a very common use case). Every time the options are re-generated, the AutoComplete defaults to the first item. This confuses our users, as the form control should probably be empty until they touch it and choose a selection. I tried your solution of setting selectedIndex to -1 but that did not solve the problem subsequent times (only the first time) when the option list was updated.

    I've worked with a lot of custom auto-complete controls in my career as a web developer, and I've never seen this UX pattern before. Is there a way we can turn it off? I'd want to prevent the autocomplete from auto-choosing a value unless the user explicitly picks one.

    Thank you in advance for your help. Have a great day!

  • Reply

    Hi Jong,
    You need to set the isRequired property to false and selectedValue to null. This will set autoComplete to null. You turn back isRequired to true once it gets focused if the field is required.

    This should help and let me know if you have further queries.

    Thanks,
    Manish Kumar Gupta
Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels