Auto complete auto opening and suggestions refresh issues

Topic: Auto complete auto opening and suggestions refresh issues

shai pro asked 7 years ago

Would appreciate feedback on a few problems in the autocomplete text field behavior. I've tried to implement a combination that works as follows: A preceding selection of value in a drop-down list affects the content (suggestions) to be presented in the autocomplete field. The optimal behavior is that the autocomplete suggestions will open automatically after the preceding field selection, even without focusing at the text field. Problems:

Suggestions don't open automatically without clicking in the field.
Clicking in the field sometimes works to open the suggestions and sometimes not (typically will work if the field was already edited and getting back to it for editing, and will not work otherwise)
Refresh of the suggestions does not work (if the suggestions should change because the preceding field value was changes, when clicking the field the suggestions will be of the previous matching value, until starting to edit which will refresh it)

A clarification:

The function Open is being called in order to make that happen, without success.

Thanks

Damian Gemza staff commented 7 years ago

Dear Shai, Let me answer you by questions numbers: 1st. Try to use [openOnFocus]="true" attribute. Place it on your element, 2nd. Unfortunately I'm unable to reproduce this. For me, in every case when I click on completer, the dropdown shows, 3rd. In my opinion it's proper behavior, but we'll take a deeper look at this, and we'll think how to improve this situation. Best Regards, Damian

shai pro commented 7 years ago

Hi, openOnFocus is being used (originally), and it still does not work as I described I can demo this if needed. Thanks

Damian Gemza staff commented 7 years ago

Please provide me demo of this. I've tested it, and in my opinion it works properly. When you click or focus an input, dropdown is visible. Best Regards, Damian

Quickode free commented 7 years ago

Dear Damian My name Is Avi, and i'm the developer working on the project Shai is asking about. So I just want to explain the problem we have... First let me explain how we are using the completer: In the page component we have a variable A which is a an array of objects of type B. In the B objects we have two fields which are related ,let's call them x(int) and y(string). then we have another variable in the component called C which is an array of objects of type D. and in the D object we have a filed called z(string) which should be filled in to the filed y of the B object using the completer. so in the template of the component we have a section for each B in A. and each section is a form... so in the form we have a field in which the user selects a value for the field x and then he can choose a value for the field y from the completer (which should be on of the values from the z field of the D objects). So the relation between the fields x and y is like this: The B object also has a filed let's call s(int) which these objects should be filtered by them before the completer uses them to show the suggestions. so s should equal x. so we are using the completer like this: So as you can see we have a function which returns a CompleterData for suitable the selected type [x] ... But we are facing the following problems: 1. The open api in the completer doesn't respond. 2. if the user adds a new B to the A array and then clicks in the completer field it doesn't open at all and if he clicks again the drop down opens without showing any suggestions and only shows "Loading" and freezes. 3. If the B object which the user is trying to Edit now has already been in the array and has a value in the y field and he changes the value of x the suggestions which should be changes because the value x has changed are not changed and the completer keeps showing the suggestions of the last type. I hope I have made myself clear. Thanks Avi

Dear Damian
My name Is Avi, and i'm the developer working on the project Shai is asking about.

So I just want to explain the problem we have...

First let me explain how we are using the completer:

In the page component we have a variable A which is a an array of objects of type B.
In the B objects we have two fields which are related ,let's call them x(int) and y(string).

then we have another variable in the component called C which is an array of objects of type D.
and in the D object we have a filed called z(string) which should be filled in to the filed y of the B object using the completer.

so in the template of the component we have a section for each B in A. and each section is a form...
so in the form we have a field in which the user selects a value for the field x and then he can choose a value for the field y from the completer (which should be on of the values from the z field of the D objects).

So the relation between the fields x and y is like this: The B object also has a filed let's call s(int) which these objects should be filtered by them before the completer uses them to show the suggestions. so s should equal x.

so we are using the completer like this:

So as you can see we have a function which returns a CompleterData for suitable the selected type [x] ...

But we are facing the following problems:
1. The open api in the completer doesn't respond.
2. if the user adds a new B to the A array and then clicks in the completer field it doesn't open at all and if he clicks again the drop down opens without showing any suggestions and only shows "Loading" and freezes.
3. If the B object which the user is trying to Edit now has already been in the array and has a value in the y field and he changes the value of x the suggestions which should be changes because the value x has changed are not changed and the completer keeps showing the suggestions of the last type.

I hope I have made myself clear.
Thanks
Avi

Please insert min. 15 characters.

Damian Gemza staff commented 7 years ago

Guys, I don't know if I understood your problem well, but: at a glance - you've got something like dropdown with values and Material Select. After clicking in dropdown you want to pass click value to Material Select? Did I understand you right? Please let me know. Best Regards, Damian

Quickode free commented 7 years ago

Hi Demian Thanks for the response. Not exactly... the value which is selected using the dropdown is saved as a field of an object, and then using that selected value the list which in the completer should search for the suggestion should be updated. I would really appreciate it if I could have your email address and could explain the problem again using screenshots or maybe a video. Thanks Avi

Damian Gemza staff commented 7 years ago

Dear Quickode, Of course, here's my email: d.gemza@mdbootstrap.com. Feel free to post screenshots, videos, or even reproduction repository on github. Everything which would help me debug your app would be good. Best Regards, Damian

Add comment

Write

Create snippet

FREE CONSULTATION

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

Status

Specification of the issue

ForumUser: Pro
Premium support: No
Technology: MDB Angular
MDB Version: -
Device: -
Browser: -
OS: -
Provided sample code: No
Provided link: No

shai

Pro User 0Support score
4Questions 0Answers 0Snippets