AJAX Live Data Search Using Nodejs MongoDB Express
Вставка
- Опубліковано 30 вер 2024
- Hey guys, this one is a revamp of one of my older videos. The link to which can be found here: • AJAX - live search. Us...
This video will teach you how to create a live search in Nodejs, where communication between the server and the client is done through AJAX, so the client never has to refresh their browser.
The example used in this tutorial is a database that stores some of the most common fruits which the client will be able to search through using the live search bar. The database in question is a MongoDB database because that is the database that is most often coupled with Nodejs. Although, it shouldn’t be too hard to adapt this tutorial into a SQL database such as PostgreSQL.
I decided to remake one of my older videos because for starters, that video had a pretty low production quality: its text was really small, my explanations where lacking and I used jQuery, a dying ‘framework’ unnecessarily. Well, this video sets to write those wrongs. To begin with, I will be using fetch API which is a much more modern approach to make AJAX requests to a server. I also hope to improve the quality of my explanations and just the overall code that I am writing in general.
💻 Technologies used:
- NodeJS.
- Fetch API.
- MongoDB.
If you enjoyed this video then please consider liking 👍 and subscribing. You would be doing me a huge favour if you did this and it would be greatly appreciated ❤️ by me. Likewise, if you have any queries or comments that you want answered. Then please, don’t hesitate post them down into the comments box below. I would love to hear back from you and will answer all of your questions to the best of my ability.
Stay awesome guys. ❤️
#webdev#backend#frontend#JavaScript#nodejs#SQL - Наука та технологія
Hello, do you have the source code, could you please share with your Github account?
Video Request: Please can you do a video, extending this particular video where instead of rendering the search Result as plain text, use the search Result to filter an existing table
Why the code didn’t work even I copied all the code？ the search bar only show “sorry.nothing found”.Mongoose is already connected
Nice video! And I need some help. Can you tell me how to do that, but with nested data?
Is it working fine with ejs file? I can't able to get data in ejs file.
Great Video good delivery, Meanwhile what if in DB you have the following as fruit names,
Bing Cherry,
Dragon Fruit,
Damson Plum,
Dew Berries,
Dinosaur Eggs
Each Fruit has two words Name:
How would you fetch each fruit by entering the First letter of the second name.
Eg. C in "Bing Cherry"
from your tutorial it will return Null, please how can I achieve that ?
@Kawaii chan That's a smart solution! It'll be most ideal if it can search the first letter of each word. i.e. a query of "u" in Mr. Ernest's example should return no match but your solution would return "Damson Plum" since it contains the letter "u". Regardless, it's still better than finding no match!
It's working only for partial search. When I type 'appl' , it is showing 'apple'. But when I type 'apple', it is showing 'Sorry.Nothing found.'
what do I need to change in the match variables when I want to allow the user to use numbers?
So if I eg. have a name "123 test", I want it to show up when I type "1"
Just found this video. Great tutorial. Is it possible to do it without using mongoose? Im using mysql with local database (xammp)
how to handle if someone is searching a sentence
@Kawaii chan no
Good tutorial of a great live data search input. Thank you very much for uploading it, it is very useful.
Great video my friend, I really wanted to learn how to implement this functionality.
thanks a lot can you give github code?
Very usefull. Thank you!
The regex thing is not working tho...
Very usefull , thank you !!!
👍
thanks! very usefull
Nice intro bro, I see you 😂
Great video mate
Good job Luke !
Great Jobs
Thank you!
Great video. I'm still a beginner, but can you explain why the request is Post and noget Get?
get request will use the query string which can make the url ugly and sometime you dont want anyone to get access to these data
@@hamzaseif4992 Makes sense, thanks! :)
But how to select the result 🤔 ,it is only showing I want to select them also
Not sure what you mean "select" but you can simply change the content in the tag to make it do what you want it to do. I changed it to tag and pass in the object ids as the href and it'll link to the item's detail page.