Input control with invalidInput event

Input control with invalidInput event

Posted by: rihiham148 on 16 November 2022, 3:02 pm EST

• 

  rihiham148

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 16 November 2022, 3:02 pm EST

  I want my invalid input event for autocomplete/combobox, to be set in a way that as the user enters incorrect input other than text which is in display Path, then it should get fired. Also do not have any more or extra conditon for this event.
  
  Thanks in advance
  
  Arohi

• 

  vivek.pannu

  

  • Post Options:
  • Link
    Copy

  Posted 17 November 2022, 5:54 pm EST

  Hi Arohi,

  You can use the ‘onInvalidInput’ method to trigger the ‘invalidInput’ event as per your requirements. However, if you don’t want the user to enter values which are not in items of the itemsSource collection, you can set the ‘isEditable’ property of the combobox/autoComplete to false, as it will restrict the content of the input element to items in the itemsSource collection.

  Please find attached a sample for the same - https://stackblitz.com/edit/js-jnpghh?file=index.js

  Regards

• 

  rihiham148

  • Post Options:
  • Link
    Copy

  Posted 20 November 2022, 2:47 pm EST

  Here I have an issue that is whenever I enter ‘in’ for eg. In autocomplete control, then there are valid options in the drop-down but when I select Singapore in it it still shows invalid input in html and console. Kindly resolve this.
  
  Thanks
  
  Arohi

• 

  rihiham148

  • Post Options:
  • Link
    Copy

  Posted 20 November 2022, 2:47 pm EST

  Here I have an issue that is whenever I enter ‘in’ for eg. In autocomplete control, then there are valid options in the drop-down but when I select Singapore in it it still shows invalid input in html and console. Kindly resolve this.
  
  Thanks
  
  Arohi

• 

  vivek.pannu

  

  • Post Options:
  • Link
    Copy

  Posted 20 November 2022, 11:16 pm EST

  Hi,

  To avoid this issue, you can handle the ‘textChanged’ event on the ‘autoComplete’ and ‘comboBox’ control, for checking the validation errors.

  Please refer to the following updated sample for the same - https://stackblitz.com/edit/js-g94pyd?file=index.js

  Regards

• 

  rihiham148

  • Post Options:
  • Link
    Copy

  Posted 21 November 2022, 2:12 pm EST

  This stackblitz code which you have provided is not running correctly, and also when i did the same thing it is throwing console error.

• 

  vivek.pannu

  

  • Post Options:
  • Link
    Copy

  Posted 21 November 2022, 6:28 pm EST - Updated 21 November 2022, 6:33 pm EST

  Hi,

  Sorry, we are unable to replicate your issue on our end, as there is no such issue on our end. Please refer to the following image
  
  

  Can you please share a sample replicating your issue, with us, on which we can investigate and assist you accordingly.

  Regards