I have this code from an open source application that returns data from an AJAX request into an autocomplete field.
This is the code:
// set autocomplete to customer type fields $('#SearchInsert').find('.CustomerCompanySearch').each(function() { var InputID = $(this).attr('id') + 'Autocomplete'; $(this).removeClass('CustomerCompanySearch'); $(this).attr('id', InputID); $(this).prev().attr('id', InputID + 'Selected');
// escape possible colons (:) in element id because jQuery can not handle it in id attribute selectors ITSM.Agent.CustomerSearch.Init( $('#' + Core.App.EscapeSelector(InputID) ) );
// prevent dialog closure when select a customer from the list $('ul.ui-autocomplete').on('click', function(Event) { Event.stopPropagation(); return false; }); });
The first time I use the application, this works as it should, it appends the class "Autocomplete" to the field and data is returned into the field.
But when I submit the search and try a second seach the class "Autocomplete" is not appended anymore and the autocomplete does not work at all, note the search happens without a page reload.
If I reload the page with a F5, then the field will work again one time.
I hope I could make this somewhat clear.
How can I make the autocomplete always work without having to reload the page?