2016-08-04 68 views
0

我想創建動態輸入系統,例如當我輸入文件夾名 - 裏面的文件列表自動顯示下面的另一個輸入ChoiceField,所以我可以選擇文件。這些方法已經寫好了,問題是 - 我如何在Django視圖中創建它?Django動態輸入

這是我的觀點:

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解決,你能給我一個簡單的例子嗎?我很無奈創建一個簡單的表單。

預先感謝您!

+0

是的。你明白了,它可以通過使用ajax來解決。我會告訴你一個簡短的例子。 –

回答

0

所以基本上你做得對。您已經知道您需要使用on(change)功能datepicker

現在只要用戶更改日期,您的on(change)函數就會被觸發。所以你現在需要做的是獲得新的日期值,當你做$(this).val()時,你已經擁有了新的日期值。之後,使對應的方法在get_name views.py

像這樣的ajax調用url

$(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_nameflights數據,那麼您可以直接發送serialzed datadataajax屬性中的表格。

注意 - >你必須從你的get_name視圖返回HttpResponse作爲Ajax調用需要一個的HttpResponse從後端到成功完成Ajax調用。您可以簡單地在響應中返回一個字符串。

+0

非常感謝!我會嘗試=) –

+0

原生django的方式呢?我搜索了一下,可能會將__init__類添加到表單中以獲得類似的功能,請問關於此問題的建議? –

+0

** **覆蓋**'init'函數在後端實現** dynamic django forms **。根據我的理解,他們會工作說,例如,你有一個django的形式來進入足球運動員的信息。但是如果玩家的角色是前鋒,那麼你可以在前端使用Javascript動態地添加額外的字段,並且當數據被提交時,動態字段被添加到django FORM中(當你已經在'init'函數中定義時你會覆蓋它)。但是,他是否是前鋒的初始信號會被JS檢測到,然後ajax會告訴Django。 –