Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jquery autocomplete transformResult auto focus property not working

Now it is looking like this enter image description here

I am workingin jquery autocomplete below is my code where i want to search city.

jQuery('#citySearch').autocomplete({
        serviceUrl: basePath + '/selectMycities.json',
        paramName: "tagName", // 
        onSelect: function(suggestion) {
            cityID = suggestion.data;
            cityId=cityID;
            jQuery("#cityId").val(cityID);
            return false;
        },
        transformResult: function(response) {

            return {

                suggestions: jQuery.map(jQuery.parseJSON(response), function(item) {
                    return {
                        value: item.cityName,
                        data: item.cityId,
                        id: item.cityId
                    };

                })
            };
        }
    });

Now in above autocomplete i want to set autoFocus as true but it is not working. please help.

It should like 2nd image

enter image description here

like image 222
Kamini Avatar asked Sep 26 '22 22:09

Kamini


1 Answers

I have found the solution with reference to these https://www.devbridge.com/sourcery/components/jquery-autocomplete/

I used autoSelectFirst property and i got the respected result as like 2nd image.

autoSelectFirst: if set to true, first item will be selected when showing suggestions. Default value false.

jQuery('#citySearch').autocomplete({
        autoSelectFirst: true,
        serviceUrl: basePath + '/selectMycities.json',
        paramName: "tagName", // 
        onSelect: function(suggestion) {
            cityID = suggestion.data;
            cityId=cityID;
            jQuery("#cityId").val(cityID);
            return false;
        },
        transformResult: function(response) {

            return {

                suggestions: jQuery.map(jQuery.parseJSON(response), function(item) {
                    return {
                        value: item.cityName,
                        data: item.cityId,
                        id: item.cityId
                    };

                })
            };
        }
    });
like image 177
Kamini Avatar answered Oct 21 '22 13:10

Kamini