2017-10-05 2 views
0

양식에 자동 완성 필드를 추가하려고합니다. 그러나 나는 일할 수 없습니다. 나는 거의 모든 튜토리얼을 시도했다. 요청이 정상적으로 발송되었습니다. 응답이 200 회 있습니다. 개발자 도구 창에서 요청을 클릭하면 응답 탭에 전체 HTML 파일이 표시됩니다. 거기에 뭔가 Json formated해야하지 .. ?? 다음은 코드입니다 :Django JQuery Autocomplete

models.py

class Signers(models.Model): 
    uid = models.IntegerField(primary_key=True) 
    firstName = models.CharField(max_length=255) 
    lastName = models.CharField(max_length=255) 

views.py

def get_signers(request): 
    if request.is_ajax(): 
    q = request.GET.get('term', '') 
    signers = Signers.objects.filter(uid__icontains=q)[:20] 
    results = [] 
    for s in signers: 
     signer_json = {} 
     signer_json['id'] = s.uid 
     signer_json['label'] = s.uid 
     signer_json['value'] = s.uid 
     results.append(signer_json) 
    data = json.dumps(results) 
    print data 
    else: 
    data = 'fail' 
    mimetype = 'application/json' 
    return HttpResponse(data,mimetype) 

urls.py

url(r'^get_signers/', views.get_signers, name='get_signers'), 

praxis.html (내 템플릿)

<script> 

    $(function() { 
    $("#id_signerIds").autocomplete({ 
     source: "get_signers/", 
     minLength: 2, 
    }); 
    }); 

</script> 

<script> 
$(document).ready(function() { 

       $('#id_submissionTimestamp').hide(); 
       $('#id_issueDate').hide(); 
}); 
</script> 

{% endblock page_head %} 


{% block content %} 

<form method="POST" class="post-form">{% csrf_token %} 

<!--some other fields here... --> 

<div class="ui-widget"> 
    <label for="id_signerIds">Signers: </label> 
    <input id="id_signerIds"> 
</div> 

<button type="submit" class="save btn btn-default">Save</button> 

</form> 

{% endblock %} 
+0

_ "의 jQuery를 추가해야합니다 하지만 난에 t를 얻을 수 없다 일 "_ 정확히 무엇이 효과가 없습니까? –

+0

@PacoH. 숫자를 입력 할 때 – Danae

+0

을 입력 한 것처럼 입력 필드 아래에 결과가 표시되지 않습니다. [JsonResponse] (https://docs.djangoproject.com/en/1.11/ref/request-response/#jsonresponse-objects)를 시도하십시오. 작동하지 않으면'get_signers/'에 대한 응답의 응답을 포함 시키십시오. –

답변

0

우선 장고를 사용하는 중입니다. URL의 URL을 변경하면 URL에 내용을 입력하는 것이 좋습니다. 주석의 모든 부분을 변경할 필요가 없으므로 source: "get_signers/", 대신 source: "{% url 'get_signers' %}",을 입력하면됩니다. .

views.py

def company_autocomplete(request): 
    if request.is_ajax(): 
     query = request.GET.get("term", "") 
     companies = Company.objects.filter(name__icontains=query) 
     results = [] 
     for company in companies: 
      place_json = company.name 
      results.append(place_json) 
     data = json.dumps(results) 
    mimetype = "application/json" 
    return HttpResponse(data, mimetype) 
:

signers = Signers.objects.filter(uid__icontains=q)[:20] 
results = [] 
for signer in signers: 
    signer_json = signer.name 
    results.append(signer_json) 

난 당신이 내 코드를 제공합니다 내 작업 케이스를 제공하기 위해 :

지금 질문으로 돌아 난 당신이 코드를 변경 제안

urls.py

url(r'^api/company-autocomplete/', company_autocomplete, name='company-autocomplete'), 

add_company.html

... 
<div class="form-group bmd-form-group"> 
    <label class="bmd-label-static" 
     for="company_autocomplete_input">Cerca azienda</label> 
    <input id="company_autocomplete_input" class="form-control" 
     placeholder="Nome azienda" style="width:500px"> 
</div> 
... 
<button class="btn btn-raised btn-primary" type="submit" 
     style="background-color:#1A88B9;">Aggiungi</button> 
<script> 
    $(function() { 
    $("#company_autocomplete_input").autocomplete({ 
     source: "{% url 'company-autocomplete' %}", 
     minLength: 1, 
    }); 
    }); 
</script> 
... 

그리고 가장 중요한 것은 : 전에 자동 완성 입력

<!-- jQuery !--> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"> </script> 
<!-- jQuery UI !--> 
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css"> 
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>