JSFiddle - React, Tailwind, and code Playground

by Neeraj Yadav

HTML

<input type="search" id="searchHotel" />

JavaScript

//setup variables
				var searchTimer;                     //timer identifier
				var startTypingInterval = 5000;      //time in ms, 5 second for example
				var $searchText = $('#searchHotel'); //place-holder element for search term
				var hotelList = [
					{ name: "AB", rating: 2 },
					{ name: "dart", rating: 4 },
					{ name: "AON", rating: 3 },
					{ name: "tREAt", rating:5 }
				];

				//on keyup, start the countdown
				$searchText.on('keyup', function () {
				  clearTimeout(searchTimer);
				  //search tying once something's entered
				  if ($searchText.val().length > 0)
					searchTimer = setTimeout(startSearching($searchText.val()), startTypingInterval);
				});

				//on keydown, clear the countdown 
				$searchText.on('keydown', function () {
				  clearTimeout(searchTimer);
				});

				//user is "finished typing," do something
				function startSearching(str){
				  //start searching
				  for (var j = 0; j < hotelList.length; j++) {
					if (hotelList[j].name.match(str)){
					    console.log("hotelList[j].name :" + hotelList[j].name);
						console.log("hotelList[j].rating :" + hotelList[j].rating); //return j;
					}
				  }
				}