[Solved] Trigger autocomplete without submitting a form
Dear Quasar team,
I did some search on this topic and it seems the best workaround is using iframe.
Could you please check this link: https://stackoverflow.com/questions/15462991/trigger-autocomplete-without-submitting-a-form
So my question is that using iframe is the best practice?
This post is deleted!
Could anyone have a look, thanks!
This may not related to Quasar topic, but still appreciate if you have some proposal.
Also, in Quasar V0.17, there is a component called QAutoComplete, not sure why it is obsolete now.
I did some research again it seems using the iframe is the best choice.
<iframe name="💾" style="display:none" src="about:blank"></iframe> <form target="💾" action="about:blank"> <input name="user"> <input name="password" type="password"> <input value="Login" type="submit"> </form>
1). shorter code
2). no jQuery
3). no server-side page loaded
5). no additional classes necessary
OK , good info, using an iframe sounds a bit hacky though…
@dobbel yes, that’s true. There are some disadvantages about iframe, but I have no other better choice.
In addition, I found Quasar can provide autocomplete, but it’s not complete.
Please see my demo. https://codepen.io/Stanley-549393092/pen/oNzRXde
Here, it uses vue modify @submit.prevent so that submit event will no longer reload the page.
Step1. Input name and click button ‘submit’ (or press enter), you can find the value in the autocomplete list.
Step2. If you change the name and submit again, you can’t find the value.
Step3. If you refresh the browser and submit again, now you can see it.
It seems Q-Input can only remember the name when the first time.
Anyway, I hope it can be improved in future.
From the point of technical view, I think it can be implemented by E.g. LocalStorage if we want to deprecate iframe.
You could see if there’s a github issue about this. If not you could create a new feature request with your research.
Feature request is created.
metalsadman last edited by metalsadman
Autocomplete is a native browser feature, which is what qinput’s wrapped native input does.