Wijmo ComboBox - event for lostFocus is not getting triggered

Wijmo ComboBox - event for lostFocus is not getting triggered

Posted by: pratik.darak on 28 November 2019, 6:20 pm EST

• 

  pratik.darak

  • Post Options:
  • Link
    Copy

  Posted 28 November 2019, 6:20 pm EST

  Hi,

  I am implementing a Wijmo ComboBox inside a Wijmo FlexGrid component. I have also implemented a method to handle the ‘lostFocus’ event inside a ComboBox as follows:

  
  <wj-combo-box #wijmoComboBox
                        (initialized)="onWijmoInit()"                  (selectedIndexChanged)="onSelectionChange(wijmoComboBox.selectedItem)"                  (keydown.enter)="onValueChange(wijmoComboBox.selectedItem)"                      (keydown.tab)="onValueChange(wijmoComboBox.selectedItem)"                      								(keydown.shift.tab)="onValueChange(wijmoComboBox.selectedItem)"
                        (lostFocus)="onValueChange(wijmoComboBox.selectedItem)"
                        (keydown.arrowDown)="onArrowKey($event)"
                        (keydown.arrowUp)="onArrowKey($event)"
                        [itemsSource]="dataCollectionView"
                        [isDisabled]="disabled"
                        [isReadOnly]="readonly"
                        [placeholder]="placeholder"
                        [displayMemberPath]="displayField"
                        [selectedValuePath]="keyField"
                        [isEditable]="allowSelectValuesNotInData"
                        [isRequired]="false">
  </wj-combo-box>
  
  

  All the event handlers for keydowns are working fine for me and the function “onValueChange()” is getting executed. But my event handler for ‘lostFocus’ is not triggering a call to the same “onValueChange()” function when I click outside of the ComboBox.

  Can you please check the same? Thank you.

  Regards,
  
  Pratik

• 

  pratik.darak

  • Post Options:
  • Link
    Copy

  Posted 28 November 2019, 7:31 pm EST

  Actually the issue is - I am deleting the selected value from the comboBox by pressing ‘Backspace’ and ‘Delete’ and then clicking outside the comboBox. And I expect the value to be deleted from the ComboBox which is not happening.

  Do you think I need to handle any further event to accomplish this?

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 1 December 2019, 2:48 pm EST

  Hi Pratik,

  If you are using the ComboBox inside a numerical column, then the value may be deleting from the cell of the FlexGrid because numerical columns are required by default. Please try setting the isRequired property of that column to false. You may refer to the sample link below:

  https://stackblitz.com/edit/angular-s2gvbd

  Let me know if this solves your issue.

  Also, if you wish to use ComboBox or any other input controls as the editor for FlexGrid, I would suggest you use the CustomGridEditor class:

  https://www.grapecity.com/wijmo/demos/Grid/Editing/CustomEditors/angular

  Regards,
  
  Ashwin

• 

  pratik.darak

  • Post Options:
  • Link
    Copy

  Posted 1 December 2019, 9:07 pm EST - Updated 3 October 2022, 2:58 am EST

  Hi Ashwin,

  Thank you for your reply. I tried setting the “isRequired” property to ‘false’ in my flex-grid column but it didn’t work for me.

  Also, I drilled down further and found that we are using “wj-combo-box” inside a “wj-popup” which is included inside “wj-flexgrid-column” and then wrapped under “wj-flexgrid”.

  I have attached a screenshot of the Combo box setup that we done:
  
  

  

  706×96 2.15 KB

  (As you might have figured, 2 boxes are our combo boxes and it is a screenshot of a popup.)

  While digging further, I found out that ‘lostFocus’ event is getting triggered when I click outside of this combobox AND anywhere inside the popup. But when I click outside of the popup, the ‘lostFocus’ event of combobox and popup is not triggered.

  Below is my “wj-popup” setup:

  
      <wj-popup
              #popup
              class="cell-popup"
              hideTrigger="Blur"
              showTrigger="None"
              (hiding)="hiding()"
              [owner]="topDiv"
      >
  
  

  Do you think I should handle some event inside the popup in order to call the lostFocus event of the combobox as well as popup?

  Please let me know if you need any further information regarding this.

  Appreciate your help on this.

  Regards,
  
  Pratik

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 1 December 2019, 10:21 pm EST

  Hi Pratik,

  We tried to replicate the issue using the sample link below but we were not able to do so:

  https://stackblitz.com/edit/angular-e92v2z

  The lostFocus event is fired even if we click outside the popup, the lostFocus event for both the Popup and the ComboBox is fired. Could you please modify the sample so that it replicates the issue?

  ~regards

• 

  pratik.darak

  • Post Options:
  • Link
    Copy

  Posted 2 December 2019, 9:38 pm EST

  Hi Ashwin,

  When I try it in your sample, it works just fine but it is causing some issue in my application. Maybe because we have multiple component hierarchy in my current setup. No worries. I will try to analyse it further on my end and let you guys know if I need any further help on this.

  Thank you so much for your help.

  Regards,
  
  Pratik

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 3 December 2019, 2:25 pm EST

  Thank you Patrik for your information. Please investigate at your end and modify the sample shared by Ashwin depicting your issue so that we may replicate at our end and assist you accordingly.

• 

  ankit.jha

  • Post Options:
  • Link
    Copy

  Posted 18 May 2022, 9:10 pm EST

  Hi,

  In my case the lostFocus is getting triggered and I am able to add values in dropdown but just after tabbing out the value doesn’t remain in grid.

  It disappears , then I have to again select it from dropdown then it remains in that grid after tabbing out.

  https://www.grapecity.com/wijmo/demos/Input/ComboBox/AutoAddItems/angular
  
  Trying to achieve the same behavior as mentioned in above link.

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 19 May 2022, 2:00 pm EST

  Dulicate: https://www.grapecity.com/forums/wijmo/wijmo-combobox