2011-12-20 6 views
2

프로젝트를 PHP에서 Django로 변환하고 필터링 된 메뉴 문제가 발생했습니다. 나는 양식을 가지고 :django 동적 필터링 양식

<form action="{% url cdrs_search %}" method="post">{% csrf_token %} 
{% for field in form %} 
<div class="fieldWrapper"> 
    {{ field.errors }} 
    {{ field.label_tag }}: {{ field }} 
</div> 
{% endfor %} 
</form> 

가 지금은 island_group의 선택에 따라 island_name의 출력을 필터링 할 :

class SearchForm(forms.Form): 
    genus = forms.CharField(max_length=100) 
    # species 
    species = forms.CharField(max_length=100) 
    # island group 
    island_group = forms.ModelChoiceField(queryset=Localitymayor.objects.values_list('islandgroup', flat=True).distinct('islandgroup').exclude(islandgroup="n/a").order_by('islandgroup'), empty_label=_("Not Specified")) 
    # island name 
    island_name = forms.ModelChoiceField(queryset=Localitymayor.objects.values_list('islandname', flat=True).distinct('islandname').exclude(islandname="n/a").order_by('islandname'), empty_label=_("Not Specified")) 

내 템플릿의 라인을 따라입니다. 내 PHP 프로젝트에서 나는 다른 PHP 스크립트를 호출하는 아약스 onChange로 이것을 관리했다. 그러나, 나는 장고에서 이것을하는 방법을 조금 잃어 버렸다. 장고에서 아약스로 작업 한 것은 이번이 처음이기 때문에이 간단하지만 공통적 인 필터링 된 메뉴 문제를 다루는 가장 좋은 방법에 대한 제안은 감사하겠습니다. 미리 감사드립니다.

+0

왜 장고에서 다른 것입니까? 여전히 서버 측보기를 호출하는 Ajax onChange 함수가 필요합니다. –

답변

0

여기 betspire.com의 티켓 양식에있는 코드가 수정되었습니다. 이 코드 스 니펫은 jQuery가로드 된 상태에 따라 달라집니다.

여기 당신이 필요로하는 자바 스크립트는 다음과 같습니다

function update_select(select, data) { 
     select.find('option').remove(); 
     select.append($('<option value="">-------</option>')); 
     for (var i in data) { 
      select.append($('<option value="'+data[i][0]+'">'+data[i][1]+'</option>')); 
     } 
    } 

    $('select[name=island_group]').live('change', function(e) { 
     $.get(
      '{% url island_name_choices_for_island_group %}', 
      { 
       'island_group': $(this).val(), 
      }, 
      function(data, textStatus, jqXHR) { 
       update_select($('select[name=island_name]'), data); 
      }, 
      'json' 
     ); 
    }); 

가 URL에 추가

url(
    r'island_name/choices/$', 
    'island_name_choices_for_island_group', { 
    }, 'island_name_choices_for_island_group', 
), 

가보기에 추가

from django.utils import simplejson 

from models import * 

def island_name_choices_for_island_group(request, qs=None): 
    if qs is None: 
     # Change the default QS to your needs 
     # (you didn't specify it) 
     qs = Island.objects.all() 

    if request.GET.get('island_group'): 
     # assuming your Island model has an FK named island_group to model IslandGroup 
     qs = qs.filter(island_group__pk=request.GET.get('island_group')) 

    results = [] 
    for choice in qs: 
     results.append((choice.pk, choice.name)) 

    return http.HttpResponse(simplejson.dumps(results)) 

당신은 어떤 troubble에서 실행하는 경우 알려 주시기 바랍니다.

+0

안녕하세요, 일부 수정 코드를 시도했지만 여전히 아약스 메뉴를 업데이트 할 수 없습니다. 특히 나는 나의 html에 대해 확신 할 수 없다. 내가 가지고있는 코드를 보낼 수 있을까요? –

+0

첫 번째 : ajax 뷰에 파이썬 오류가 있습니까? (URL을 열거 나 파이어 버그를 사용하여 아약스 뷰 확인)? 둘째 : 자바 스크립트 오류 (방화 광 사용)가 있습니까? 셋째 : "console.log"문을 추가하거나 방화 광을 사용하여 자바 스크립트를 디버깅하고 예상되는 코드가 예상 된 매개 변수로 실행되는지 확인하십시오. – jpic

+0

Ok - 이제 작동하게되었습니다. 나는 아직도'qs = None'에 대해 불분명하지만. 왜 그것이 필요한지 설명해 주시겠습니까? –

1

그룹을 기반으로 이름 목록을 요청하기 위해 아약스 스크립트를 조회해야합니다.

# views.py 
def ajax_endpoint(request): 
    # leaving error checking to you 
    group = request.GET.get('group') 
    names_list = avalable_names(group) # some function or db call 
    return HttpResponse(json.dumps(names_list)) 
1

하나의 옵션은 자바 스크립트에서 수행하는 것입니다. jQuery의 ajax 요청을 사용하여 별도의보기를 호출 할 수 있습니다. 이 개별 뷰의 작업은 사용자가 선택한 island_group을 기반으로 모델 데이터 (아일랜드) 이름의 서버 측 정렬을 처리하는 것입니다. 그런 다음 자바 스크립트를 사용하여보기의 응답을 사용하여 양식을 다시 채울 수 있습니다. 이 작업을 수행하는 방법에 대한 좋은 예는 in this blog (약간 밀도가 높지만 매우 유용함), in an article on how to do this with javascriptin this tutorial (권장)입니다.

왜 이런 식으로해야 할 필요가 있는지를 설명하는 좋은 SO 게시물이 있습니다. 포함 할 수있는 약간의 페틱이 될 수도 있지만 필터링 된 양식을 만드는 동안 나에게 분명히 도움이됩니다. 그 질문에 대해서는 accepted answer을보십시오.

+0

귀중한 정보 주셔서 감사합니다. 나는 내가 그것을 위해 일할 수 있는지 알게 될 것이다. –