Capture the search clear event on search input fields


HTML • JavaScript • JQuery

Sample html input search field

<input id="menuSearchFld" onkeyup="searchMenu()" autocomplete="off" placeholder="What are you looking for?" type="search"/>

Javascript/jQuery code to fire when the user clicks the clear button

/* When the search field clear event fires */
var fld = $('#menuSearchFld');
if (fld.length){
	document.getElementById("menuSearchFld").addEventListener("search", function(event) {
		searchMenu();
	});
}

Written by fbrefere001

Posted by fbrefere001 on Wednesday July 3, 2019