Autocomplete from scratch using jquery

Question

I know that stackoverflow is not to do my job, for that I ask for generics advices

my autocomplet will be in a input, from what I know, input has "get" and "post" request. I need to make a post request, and here is my problem. My autocomplete read information from a endpoint JSON, that is generated when you make a request from server, e.g. http://www.imobiliare.ro/sugestii/huned, I need a javascript function, that is continuous read and send information from input text to URL.

E.g

I have :"http://www.imobiliare.ro/sugestii/huned"+ T , T value from input, Information is pass to URL and generate a JSON, after that http://www.imobiliare.ro/sugestii/huned+T+I, TI values from input.

Hard part for me is how to send continuous that information to url without press a submit button, something like every time I pass a value in input text, is read and send automaticali to URL and make a request

I can't use any existing lib.

hijarian · Accepted Answer · 2015-09-25 12:34:08Z

2

Here is some starting points for you, which you should already know if you took a task which says "do not use any libraries". Autocomplete "without using any libraries" is wrong design requirement and a waste of time in almost all cases imaginable.

Bind a listener on "keyup" event.
This listener should fire not each time "keyup" is fired, but with delay of ~500 ms, or else you'll be triggering POST requests on each letter entered, and in case of "deoxyribonucleic acid" will be probably overkill.

That's all. You absolutely do not need any "continuous" checking, only key presses.

For "continuous" checking you should use setTimeout and setInterval functions.

EDIT

Here is JsFiddle with the crude solution showing both of my points: you attach an event listener to the text input and then (with proper debouncing mechanics!) on key presses you send a request to your backend API. Everything else is up to your imagination. Usually results are returned into a dropdown list, but I certainly would not reimplement that from scratch.

edited Sep 25, 2015 at 12:34

answered Sep 24, 2015 at 6:13

hijarian

2,2481 gold badge29 silver badges35 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Silviu Over a year ago

I very new in javascript, I tried to found examples with what you told me, but I was unlucky, Can you help me with a littel example ?

hijarian Over a year ago

If you need an example, I would suggest you to read sources of the various javascript autocomplete plugins out there at Github. Code there varies in level of badness but all this is production code nevertheless.

hijarian Over a year ago

Also, you asked for "generic advices" in your question and now you ask for example of code. ;P

hijarian Over a year ago

Look at how much code is in codebase of Twitter's autocomplete and in native Javascript autocomplete.js libraries. Are you sure you want to re-implement all this functionality from scratch?There's a lot of code just for usability improvements, though.

New_Bee · Accepted Answer · 2015-09-24 05:23:54Z

0

this might help you Building an Autocomplete from scratch with javascript

answered Sep 24, 2015 at 5:23

New_Bee

15 bronze badges

Collectives™ on Stack Overflow

Autocomplete from scratch using jquery

2 Answers 2

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related