Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: Potential Bug in < mdb-auto-completer >. (select) isn't working.

Nicolas Tsue - Orbit Coins pro asked 5 years ago


Hi,
MDB version: 7.4.3
Angular Version: 7.2.0

When working with MDB autocomplete component {@link: https://mdbootstrap.com/docs/angular/forms/autocomplete/ }, i have noticed that the (select) triger isn't fired. Tried to create a workaround solution with (click) in nested html tags, but they wasn't triggered either. could you please check your libs why isn't called?
(you probably calling $event.preventDefaults() somewhere, in a way it blocks events... just guessing...)

Expected behavior
when selecting item, we are expecting (select) event to be triggered.

Actual behavior
(select) event isn't triggered.

Resources (screenshots, code snippets etc.)

waiting for an answer, here is the code i have used:

<mdb-auto-completer #searchProductCode="mdbAutoCompleter"  textNoResults="No items was found!" [appendToBody]="true" (select)="onItemSelect($event)"> 
  <mdb-option *ngFor="let product of productsFilterList" [value]="product.code"> 
    <div class="d-flex flex-column" (click)="onItemSelect(product)"> 
      <strong>Code: {{product.code} }</strong> 
      <small>Brand: {{product.brandLabel} }</small> 
      <small>Label: {{product.label} }</small> 
      <small>Reference: {{product.reference} }</small> 
      <small>Supplier:  {{product.suppliers[0]?.label} }  (<span>#{{product.suppliers[0]?.code} }</span>)</small> 
      <a mdbBtn size="sm" floating="true" color="blue-grey" class="my-0" mdbWavesEffect (click)="onItemSelect(product)"> 
        <mdb-icon fas icon="plus" size="lg"></mdb-icon> 
      </a> 
    </div> 
  </mdb-option> 
</mdb-auto-completer>  

Please investigate why (select) isn't working, also, could you please enable (click) in ?

Cheers,


bitmads premium answered 4 years ago


@Damian Gemza It has been a year ago but it's still bugged (or again). The same is happening with the latest version of PRO MDB Angular:

"ng-uikit-pro-standard": "git+https://oauth2:qKxmqbEfehR2f3vxuTXd@git.mdbootstrap.com/mdb/angular/ng-uikit-pro-standard.git#9.4.0",

Damian Gemza staff answered 5 years ago


Dear @Nicolas Tsue - Orbit Coins

The problem with (click) event has to be debugged. For now, please use the (mousedown) event on <mdb-option> element instead of (click).

Best Regards,

Damian


Arkadiusz Idzikowski staff answered 5 years ago


We tried to reproduce the problem with (select) event but without success. If this problem still exists please send a simple demo on which we will be able to debug it to a.idzikowski@mdbootstrap.com.

We will take a closer look at the (click) event.


Damian Gemza staff answered 5 years ago


Dear Nicolas,

The mdb-auto-completer is a pro component, and according to our system, you use MDB Free version.

Please, provide us with a number of your order or registered email to confirm your access to MDB Pro components and premium support.

Send it to me on email: d.gemza@mdbootstrap.com

Best,

Damian



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 7.4.2
  • Device: Asus VivoBook S
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: Yes