cant select value of jqGrid autocomplete

Question

I use a jqGrid with jquery autocomplete on one column.

{
name : 'mdmKndcode',
index : 'mdmKndcode',
width : 150,
align : "center",
editable : true,
edittype: 'text',
editoptions: {
    dataInit: function(elem) {
        var cache = {};
        $(elem).autocomplete({
            source:  function( request, response ) {
                var term = request.term;
                console.log(term);
                if(term in cache){
                    response(cache[term]);
                    return
                }
                $.getJSON( "/example/json/"+term, request, function( data, status, xhr ) {
                    cache[ term ] = data;
                    response( data );
                  });
                },

            minLength:3
        }); 
    }
}

In the grid I can see the results of json request in autocomplete list. This works fine. But I am not able to select a value in this list. The autocomplete list getting closed and lose the focus of the column after a mouseover or Keyboard press on the list.

Tried also with "select" function but same result.

Want to have the selection of the values in the list like in this Demo

Answer 1

Looking at your jsfiddle, the problem is that you are including jqueryui twice jquery-ui.js and jquery-ui-custom.min.js , most likely both of them have autocomplete and that causes troubles. Remove one of them and that will fix the issue.

See here