Uploading data here calls a dropdown?

Hi all. The problem is that when typing in the input field (input) on the typed letters in here calls a dropdown loaded some data. For example, a photo with title. That's the job front Ender? not backender?
Here is a direct need on instagram https://www.instagram.com
Are there any examples/tutorials of this type?
June 10th 19 at 15:27
1 answer
June 10th 19 at 15:29
this is the job of the front and buck
here is an example https://jqueryui.com/autocomplete/#remote
the end result may be this ( demookay.com ) start in the search to write something
here is the code of the case, specifically on this site

$( ".fn_search" ).autocomplete( {
 serviceUrl: 'ajax/search_products.php',
 minChars: 1,
 noCache: true,
 onSelect: function(suggestion) {
 $( "#fn_search" ).submit();
},
 transformResult: function(result, query) {
 var data = JSON.parse(result);
 $(".fn_search").autocomplete('setOptions', {triggerSelectOnValidInput: data.suggestions.length == 1});
 return data;
},
 formatResult: function(suggestion, to currentvalue) {
 var reEscape = new RegExp( '(\\' + ['/', '.', '*', '+', '?', '|', '(', ')', '[', ']', '{', '}', '\\'].join( '|\\' ) + ')', 'g' );
 var pattern = '(' + to currentvalue.replace( reEscape, '\\$1' ) + ')';
 return "<div>" + (suggestion.data.image ? "<img align="absmiddle" src="" + suggestion.data.image + ""> " : ") + "</div>" + "<a href=" + suggestion.lang + "products" + suggestion.data.url '>' + suggestion.value.replace( new RegExp( pattern, 'gi' ), '<strong>$1<\/strong>' ) + '<\/a>' + "<span>" + suggestion.price + "" + suggestion.currency + "</span>";
}
 } );</strong></a>

Find more questions by tags JSONjQuery