2009-08-26 6 views
8

장고 응용 프로그램을 개발하고 싶었던 기능 중 하나는 동적 인 드롭 다운 목록입니다. 구체적으로 차량 제조업체 및 모델 ... 특정 make는 그 모델에 속하는 모델 목록 만 업데이트 할 것입니다 ....이게 자바 스크립트 나 jQuery에서 가능하다는 것을 압니다. (누군가 대답이 있다면 최선의 선택이 될 것입니다.)하지만 어떻게 해야할지 모르겠습니다. 그것에 대해.데이터베이스에서 Django 동적 드롭 다운 목록

또한 모델, 모델, 연도 및 시리즈를 공통으로 지정하여 색상, 전송 등의 다른 속성을 변수로 사용하여 하나의 모델, 모델, 연도 및 시리즈 만 입력하면됩니다. 새로운 차량. 어떤 아이디어든지 높게 평가 될 것입니다.

답변

9

세 가지 입력 값이 될 수있는 공통점, 확인, 모델, 연도가 3 가지입니다. 서버에 주어지면 세부 사항을 포함하는 객체가 호출 페이지로 리턴됩니다. 이 페이지는 JavaScript를 사용하여 객체 세부 정보를 구문 분석하고 UI를 업데이트하여 사용자에게 표시합니다.

장고 측에서는 3 개의 입력을 받아 출력을 반환 할 수있는 기능이 필요합니다. 클라이언트 측에서는 서버에 3 개의 입력을 전달하고 서버의 응답을 적절하게 구문 분석 할 수있는 기능이 필요합니다.

Django 용 REST API 프레임 워크는 위에 언급 한 "api"를 추가하기가 더 쉽습니다 (Piston). 피스톤을 사용하면 해당 리소스에 대한 URL을 만든 다음 처리기를 추가하기 만하면됩니다. 이것은 단순히 URL의 www.yoursite.com/vehicle/[make]/을 설정

urls.py: 
vehicle_details = Resource(handler=VehicleDetails) 
url(r'^vehicle/(?<make>.*)/(?<model>.*)/(?<year\d{2,4}/(?P<emitter_format>[a-z]{1,4}), vehicle_details, name='vehicle_details'), 

handler.py: 
class VehicleDetails(BaseHandler): 
    methods_allowed = ('GET',) 
    model = Vehicles #whatever your Django vehicle model is 

    def read(self, request, *args, **kwargs): 
     # code to query the DB and select the options 
     # self.model.objects.filter()...    
     # Build a custom object or something to return 

     return custom_object 

을 (여전히 피스톤 문서를 탈지해야하지만 이것은 당신에게 그것이 어떻게 생겼는지의 아이디어를 줄 것이다) [model]/[year]/json JSON에서 사용자 정의 데이터 객체를 반환하여 jquery가 구문 분석 할 수 있도록합니다.

클라이언트 측에서는 jquery를 사용하여 이벤트 (바인드)를 설정할 수 있으므로 3 개의 드롭 다운에 모두 값이 선택되면 API URL에 $ .get()이 실행됩니다. 이 결과가 돌아 오면이를 Jquery JSON 파서로 전달하고 사용자 정의 객체를 javascript 객체로 제공합니다. 그런 다음 해당 객체를 사용하여 더 많은 드롭 다운 메뉴를 채울 수 있습니다.

이 (큰 경고, 난 그냥이 복사되는 것을 의미하고 붙여 넣기 아니에요 그래서, 내 머리의 상단을 다음 썼다. 그것은 단지 일반적인 아이디어입니다.)

<script type="text/javascript"> 

    // On document load 
    $(function() { 
     $('#dropdown_make').bind('change', checkForValues()); 
     $('#dropdown_model').bind('change', checkForValues()); 
     $('#dropdown_year').bind('change', checkForValues()); 
    }); 

    function checkForValues() { 
     if ($('#dropdown_make').val() && $('#dropdown_model').val() && $('#dropdown_year').val()) 
      updateOptions();   
    } 

    function updateOptions() { 
     url = '/vehicle/'; 
     url += $('#dropdown_make').val() + '/'; 
     url += $('#dropdown_model').val() + '/'; 
     url += $('#dropdown_year').val() + '/'; 
     url += 'json/'; 
     $.get(url, function(){ 
      // Custom data object will be returned here 
     }) 
    } 
</script> 

0

이 기괴한입니다 : Dynamic Filtered Drop-Down Choice Fields With Django

그의 질문 :

는 "여기 상황이다. 내가 차 데이터베이스를 만들고 사용자가 화장을 선택하면 모델은, 내가 원하는이 해당 모델과 관련된 모델만으로 모델 드롭 다운을 업데이트하십시오 ... 따라서 Ajax를 사용하여 데이터를 채우고 싶습니다. "

당신은 같은 사람이 아니십니까? :)

+0

아니 같은 녀석 ... 우리가 똑같은 문제를 풀려고하는 것뿐입니다. 링크 덕분에, 그것은 나에게 좋은 시작처럼 보입니다. –

+2

나는 그 사람이다. 그리고 이것은 기괴하다. :) – Dustin