Django 동적 입력

Question

동적 입력 시스템을 만들고 싶습니다. 예를 들어 폴더 이름을 입력 할 때 - 내부에있는 파일 목록에 다른 입력 ChoiceField가 자동으로 표시되어 파일을 선택할 수 있습니다. 메서드는 이미 작성되었습니다. 문제는 - 장고보기에서 어떻게 만들 수 있습니까?

다음

def get_name(request): 
    if request.method == 'POST': 
     form = NameForm(request.POST) 
     if form.is_valid(): 
      dir_date = format_date(request.POST['date']) 

      files = os.listdir(os.path.join(path+dir_date)) 
      return render(request, 'inform/show_name.html', {'data': request.POST['your_name'], 
                  'date': format_date(request.POST['date'])}) 
    else: 
     form = NameForm() 
    return render(request, 'inform/base.html', {'form': form}) 

양식 클래스입니다 :

class NameForm(forms.Form): 
    your_name = forms.CharField(label='Your name', max_length=100) 
    date = forms.DateField(widget=forms.DateInput(attrs={'class': 'datepicker'})) 
    flights = forms.ChoiceField(choices=?) 

마지막으로, 여기 내 템플릿입니다

여기 내이다.

{% extends 'inform/header.html' %} 
{% block content %} 
    <script> 
     $(function() { 
     $(".datepicker").datepicker(); 
     $("#anim").on("change", function() { 
      $("#datepicker").datepicker("option", "showAnim", $(this).val()); 
     }); 
     }); 
    </script> 
    <div class="container" style="color: red; size: auto;"> 
     <form class="form-vertical" action="get_name" role="form" method="post"> 
      {% csrf_token %} 
      <div class="form-group" style="display: inherit"> 
      <center> 
       {{form}} 
       <input type="submit" value="OK"> 
      </center> 
      </div> 
     </form> 
    </div> 
{% endblock %} 

동적으로 날짜 입력에서 데이터를 읽고 제출 버튼을 클릭하거나 여러 다른 사람을 만들지 않고 뷰 내부의 방법으로 제공 할 수있는 방법이 있나요? ajax, jQuery 또는 JS만으로 해결할 수 있다면 간단한 샘플을 제공해 주시겠습니까? 나는 단순한 형식을 만들 수 없다는 것에 꽤 좌절감을 느낍니다.

미리 감사드립니다.

Answer 1

그래서 기본적으로 올바르게하고 있습니다. 이미 on(change) 기능이 필요합니다. datepicker

사용자가 날짜를 변경하자마자 on(change) 기능이 실행됩니다. 따라서 지금해야 할 일은 새로운 날짜 값을 얻는 것입니다.이 값은 이미 $(this).val() 일 때 가지고 있습니다. 그 후 views.py에 당신의 방법 get_name이 같은

뭔가 해당하는 url에 ajax 호출합니다

$(function() { 
    $(".datepicker").datepicker(); 
    $("#anim").on("change", function() { 
     $("#datepicker").datepicker("option", "showAnim", $(this).val()); 
     send_changed_date_value(variable_with_new_date); 
    }); 
}); 

function send_changed_date_value(new_date) { 
    $.ajax({ 
     type: // "POST" or "GET", whichever you are using 
     url: "/url in urls.py corresponding to get_name method in views.py/", 
     data: new_date, 

     success: function(response){ 
      console.log("Success..!!") 
     } 
    }); 
} 

이것은 당신이 당신의 의견에 새 날짜 값을 보낼 수있는 방법입니다, 매번 그것은이다 변경되었습니다. your_name 및 flights 데이터와 같은 완전한 양식 데이터를 제출하려는 경우 의 data 속성에서 양식의 serialzed data을 직접 보낼 수 있습니다.

주 - 아약스 호출이 성공적으로 아약스 호출을 완료하기 위해 백엔드에서 HttpResponse에을 필요로> 당신은 당신의 get_name보기에서 HttpResponse를 반환해야합니다. 응답에서 단순히 문자열을 반환 할 수 있습니다.