无法在自动完成选择上更改文本框值

时间:2015-09-01 23:24:23

标签: javascript jquery django autocomplete

我想使用自动填充功能更改另一个文本框选择的文本框值。我使用的是django 1.7和jquery 1.9

我不擅长javascript我尝试了很多解决方案来使用django自动完成工作,但我无法更改其他文本框值。

这是django代码

view.by

  def auto_complete(request):
   search = request.GET['term']
   products = Products.objects.all().filter(product_name__startswith=search)
   products_serialized = serializers.serialize('json', products)
   return JsonResponse(products_serialized, safe=False)

url.by

url(r'^autocomplete/$', views.auto_complete, name='Auto Complete'),

文本框

<input type="text" id="product" name="product" class="product" value="">
<input type="text" id="price" name="product" class="price" value="">

javascript功能

    function Complete(){
    $( "#product" ).autocomplete({
        select: function (e, ui) {
            $("#product").val(ui.item.label);
            return false;
        },
        minLength: 1,
        source: function (request, response) {
            $.ajax({
                url: '/autocomplete',
                data: request,
                success: function (data) {
                    var ParsedObject = $.parseJSON(data);
                    response($.map(ParsedObject, function (item) {
                        var results = item.fields.product_name ;
                        return {
                            value: results
                        };
                    }));
            },
        });
    }
});
}

1 个答案:

答案 0 :(得分:0)

我找到了答案

function Complete(){
$( "#product" ).autocomplete({
        select: function (e, ui) {
            $("#product").val(ui.item.label);
            return false;
        },
        source: function (request, response) {
            $.ajax({
                url: '/autocomplete',
                data: request,
                success: function (data) {
                    var ParsedObject = $.parseJSON(data);
                    response($.map(ParsedObject, function (item) {
                        var name = item.fields.product_name ;
                        var price = item.fields.product_price ;
                        var count = item.fields.product_count ;
                        var the_id = item.pk ;
                        return {
                            value: name,
                            price: price,
                            count: count,
                            the_id: the_id,
                        };
                    }));
            }
    });
},
    minLength: 1,
    autoFocus: true,
        select: function ( event, ui ) {
              $('#price').val( ui.item.price );
              $('#count').val( ui.item.count );
              $('#the_id').val( ui.item.the_id );
        },
    });