Django-crispy-forms中的next-tab和previous-tab按鈕

Question

我嘗試過Django-crispy-forms並且非常喜歡它，我創建了一個窗體，它分成4個選項卡（由於有很多字段）。

現在，我想添加下一個標籤和前一個標籤按鈕在標籤之間導航，你能告訴我如何用Django-crispy-forms做到這一點嗎？

謝謝！

Answer 1

我找到了解決方案，我認爲這不是一個好的解決方案，所以請看看並隨意推薦其他方法。謝謝 ！

class ProfileForm(forms.ModelForm): 
    helper = FormHelper() 
    helper.form_tag = False 
    helper.layout = Layout(
     TabHolder(
      Tab(
       '1. Personal Information', 
       'first_name', 'last_name', 'address', 'city', 'zip_code', 'state', 'email', 'phone_number', 
       'how_did_you_hear_about_us', Button('Next', 'Next', css_class="btnNext") 
      ), 
      Tab(
       '2. Education Background', 
       'the_highest_qualification', 'school_graduated', 'year_of_graduation', 
       Button('Previous', 'Previous', css_class="btnPrevious"), Button('Next', 'Next', css_class="btnNext") 
      ), 
      Tab(
       '3. Work Experience', 
       'job_title', 'company', 'location', 'from_time', 'to_time', 'resume', 
       Button('Previous', 'Previous', css_class="btnPrevious"), Button('Next', 'Next', css_class="btnNext") 
      ), 
      Tab(
       '4. Application Question', 'are_you_18_years_of_age_or_older', 
       'are_you_eligible_to_work_in_US', 
       Button('Previous', 'Previous', css_class="btnPrevious"), Button('Next', 'Next', css_class="btnNext") 
      ), 
      Tab(
       '5. Account',    
       'password1', 'password2', 
       Button('Previous', 'Previous', css_class="btnPrevious"), 
       StrictButton('Register', css_class='btn-primary', type='submit'), 
      ) 
     ) 
    ) 

在HTML模板，把這個：

<script> 
     $('.btnNext').click(function(){ 
     $('.nav-tabs > .active').next('li').find('a').trigger('click'); 
    }); 

     $('.btnPrevious').click(function(){ 
     $('.nav-tabs > .active').prev('li').find('a').trigger('click'); 
    }); 
    </script>