Right way to autocomplete

I have the following% auto_complete :

$(document).ready(function () {
    $("#id_cliente").autocomplete({
        source: function (request, response) {
            $.ajax({
                url: "/PreVenda/CarregaClientePorId",
                type: "POST",
                dataType: "json",
                data: { id: request.term },
                success: function (data) {
                    response($.map(data, function (item) {
                        return {
                            label: item.id,
                            value: item.id,
                            id: item.nome_razao
                        };
                    }))

                }
            })
        }, select: function (event, ui) {
            console.log(ui)
            $("#nome_cliente").val(ui.item.id);
        },
        messages:
    {
        noResults: "", results: ""
    }
    });
})

This script , when entering the customer ID, loads a list of IDs, and selecting the desired ID, the customer name is filled in. It is doing it right, but by selecting it once, I can not click to select it again. I can only select again if I press the up or down keys, and press the ENTER key. I can not select when I click the mouse, and the following error appears:

  

Uncaught TypeError: Can not read property 'call' of undefined

I'd like to know what I'm doing wrong in autocomplete , so I can click and select more than once.