WjAutocomplete - Clear input after selection

WjAutocomplete - Clear input after selection

Posted by: ajg on 14 September 2017, 11:36 am EST

• 

  ajg

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 14 September 2017, 11:36 am EST

  I have a wj-auto-complete dropdown menu, with a number of options.
  
  The reason we choose this element, is that it limits the options based on the input from the user.

  However, I find that the list of options is not reset when the user has selected an option.
  
  The scenario is:

  1. A list of 20 options is loaded into the element.
  2. User enters 3 characters. 5 matching options are returned and listed in the dropdown menu.
  3. User selects 1 of these 5 options from the dropdown menu.

  When the user comes back to the dropdown to select another option, the dropdown will still only display the 5 options that matches the 3 characters.

  Is it possible to “reset” the wj-auto-complete dropdown to list all the 20 options, when the user has selected 1 of the 5 matching options?

• 

  manpreet-kaur

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 11:36 am EST

  Hello,

  You can reset wj-auto-complete dropdown by setting Text property to null.
  
  Please refer the fiddle for accomplishing your requirements.

  Thanks.

• 

  marooned

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 11:36 am EST

  Hi there. I have exact issue. I’m using Wijmo 5.20163.254 and Angular 2. I’ve tried to set text property to ‘’ or null. I’ve also tried other properties like selectedItem or selectedValue. All of them behave it the same way: the text stays after selection and I can use left/right arrow to move the cursor on this text. The text disappears when I hit up/down arrow or any character.
  
  I’ve tried to call .refresh() after setting .text to null, but that did not help.

  Any advice how to clear input without the need for user to hit (almost) any key?

• 

  manish-gupta1

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 11:36 am EST

  Hi,
  
  If you would like to clear selection on focus, set selectedValue property to null or text to “”.
  
  For your reference, please see the fiddle sample that implements the same.

  Hope it helps !

  Thanks,
  
  Manish Kumar Gupta

• 

  fullah

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 11:36 am EST

  Hi Manpreet,

  Can you tell me how to trigger gotfocus event on dropdown combobox?

  Is there any sample code of gotfocus event?

• 

  manish-gupta1

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 11:36 am EST

  Hi,
  
  If you are referring ComboBox gotFocus event, please refer to the following code snippet:

  comboBox.gotFocus.addHandler(function(s,e){
    console.log("ComboBox Focused");
  });

  If you are referring to dropDown focus, you need to handle listBox gotFocus event. Please refer to the following code snippet:

  comboBox.listBox.gotFocus.addHandler(function(s,e){
     console.log("DropDown focused");
  });

  Hope it helps!

  Thanks,
  
  Manish Kumar Gupta

• 

  boyagowri

  • Post Options:
  • Link
    Copy

  Posted 10 December 2020, 5:12 am EST

  Hi Manish,
  
  I’m trying to implement drodowntree control in my angular application but I’m unable to implement it because it is in pure js, please help me how to implement dropdown tree view in angular is there any import is there in wijmo?

  https://demos.wijmo.com/5/PureJS/DropDownTree/DropDownTree/ which is there in pure js but I’m trying to implement it in angular.

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 14 December 2020, 1:28 pm EST

  Hi,

  DropDownTree is a custom implementation and not part of the standard wijmo suite. To use it in an angular application you may refer to the following sample which demonstrates the same and let us know if you face any issues:
  
  https://codesandbox.io/s/wijmo-angular-forked-ugsxw?file=/src/app/app.component.ts

  Regards