Question

我是Django使用typeahead.js的新手。我也在使用handlebars_min.js。当我输入三个字符时，我会在列表中显示与搜索匹配的项目，在执行Click时，元素将放在input中。问题是当我选择元素并在input之外点击时，input的值消失了。

在我的代码下面：

Views.py

    def json_destino(request):
    destino = request.GET.get('q', None)

    if not destino:
        return HttpResponse(json.dumps({}))

    destinos = Clientes.objects.filter(nombre__icontains=destino)

    vl = [{'name': c.nombre,'destino': c.nombre} for c in destinos]
    vl = vl[:10]
    ret = json.dumps(vl[:10])
    return HttpResponse(ret)

文件 autocomplete.js

$(function()
    {
    var engine1 = new Bloodhound({
        remote: '/destino/name/json/?standard=true&q=%QUERY',
        datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
        queryTokenizer: Bloodhound.tokenizers.whitespace,

    });

    engine1.initialize();
    $('#id_destino').typeahead({minLength: 3,highlight: true}, {
        name: 'destino',
        displayKey: 'id',
        source: engine1.ttAdapter(),
        templates: {
            empty: [
                '<div class="empty-message">',
                'No se ha encontrado ningun elemento',
                '</div>'
            ].join('\n'),
            suggestion: Handlebars.compile('<p style="border: 1px solid red; padding: 5px;">'+'<span class="text-primary" style="font-size:20px;">{{name}}</span><br>' +'</p>')
        }
    }).bind('typeahead:selected', function(obj, datum) {
        taselected(obj, datum);
    }).bind('typeahead:autocompleted', function(obj, datum) {
        taselected(obj, datum);
    });

    function taselected(obj, datum) {
        $("#div_id_destino").click();
        $("#id_destino").val(datum.destino);

    }
});

HTML

<div id=div_id_destino>
 <input type="text" name="destino"  id="id_destino" />
</div> 
<script src="{% static 'js/autocomplete.js' %}"></script>

输入的值消失

0 个答案: