我正在尝试在Django中提交具有多个详细信息的表单，因此我决定分开设置下一个按钮，然后将隐藏第一组详细信息，并显示下一组详细信息，并且在最后一组中进行表单提交细节。我已经完成了代码，并将标记放在开始标记和结束标记放在底部。但是表格没有提交。它没有显示任何错误。当我单击按钮时，没有任何反应
<form method="POST">{% csrf_token %}
<div id="personal_info">
<div class="container">
<div class="form-row">
<div class="form-group col-md-4">
<label for="firstname">First Name</label>
{{form.first_name}}
</div>
<div class="form-group col-md-4">
<label for="middlename">Middle Name</label>
{{form.middle_name}}
</div>
<div class="form-group col-md-4">
<label for="lastname">Last Name</label>
{{form.last_name}}
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="emailadd">Email Address</label>
{{form.email_address}}
</div>
<div class="form-group col-md-5">
<label for="contact">Contact No</label>
{{form.contact_no}}
</div>
<div class="form-group col-md-1">
<label for="contact">Age</label>
<input type="number" class="form-control" id="contact">
</div>
</div>
<div class="form-row">
<div class="form-group col-md-4">
<label for="position">Position</label>
{{ form.position_applied_for }}
</div>
<div class="form-group col-md-4">
<label for="gender">Gender</label>
{{ form.sex }}
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="birthplace">Place of birth</label>
{{ form.place_of_birth }}
</div>
<div class="form-group col-md-6">
<label for="birthdate">Date of birth</label>
{{ form.date_of_birth }}
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="city_address">City Address</label>
{{ form.city_add }}
</div>
<div class="form-group col-md-6">
<label for="city_zip">City Zip</label>
{{ form.city_zip }}
</div>
</div>
<div class="form-row">
<div class="form-group col-md-4">
<label for="citizenship">Citizenship</label>
{{ form.citizenship }}
</div>
<div class="form-group col-md-4">
<label for="religion">Religion</label>
{{ form.religion }}
</div>
<div class="form-group col-md-4">
<label for="source_type">Where did you find Halcyon?</label>
{{ form.source_type }}
</div>
</div>
<div class="form-row">
<div class="form-group col-md-4">
<label for="physical_deformities">Physical Deformities</label>
{{ form.physical_deformities }}
</div>
<div class="form-group col-md-4">
<label for="blood_type">Blood Type</label>
{{ form.blood_type }}
</div>
<div class="form-group col-md-4">
<label for="marital_status">Marrital Status</label>
{{ form.marital_status }}
</div>
</div>
<div class="form-row">
<div class="form-group col-md-3">
<label for="sss">SSS No.</label>
{{ form.sss }}
</div>
<div class="form-group col-md-3">
<label for="tin">TIN No.</label>
{{ form.tin }}
</div>
<div class="form-group col-md-3">
<label for="hdmf">HDMF No.</label>
{{ form.hdmf }}
</div>
<div class="form-group col-md-3">
<label for="phil">Phil health No.</label>
{{ form.phil }}
</div>
</div>
<div class="form-row">
<div class="form-group col-md-3">
<label for="person_emerg_name">Person to notify in case of emergency</label>
{{ form.person_emerg_name }}
</div>
<div class="form-group col-md-3">
<label for="person_emerg_add">Address of the person to notify in case of emergency</label>
{{ form.person_emerg_add }}
</div>
<div class="form-group col-md-3">
<label for="person_emerg_zip">Zip Code</label>
{{ form.person_emerg_zip }}
</div>
<div class="form-group col-md-3">
<label for="person_emerg_contact_no">Contact No.</label>
{{ form.person_emerg_contact_no }}
</div>
</div>
<div class="form-row">
<div class="form-group col-md-3">
<label for="tax_status">Tax Status</label>
{{ form.tax_status }}
</div>
</div>
</div>
<button id="next_family">Next</button>
<input type="submit" value="submit">
</form>
</div>
<div id="family_info">
<div class="container">
<div class="form-row">
<div class="form-group col-md-2">
<label for="firstname">Spouse Last Name</label>
{{form.spouse_last_name}}
</div>
<div class="form-group col-md-2">
<label for="middlename">Spouse First Name</label>
{{form.spouse_first_name}}
</div>
<div class="form-group col-md-2">
<label for="lastname">Spouse Middle Name</label>
{{form.spouse_middle_name}}
</div>
<div class="form-group col-md-2">
<label for="emailadd">Occupation</label>
{{form.spouse_occupation}}
</div>
<div class="form-group col-md-1">
<label for="contact">Age</label>
{{form.spouse_age}}
</div>
<div class="form-group col-md-2">
<label for="contact">Spouse Tel No:</label>
{{form.spouse_telno}}
</div>
</div>
<div class="form-row">
<div class="form-group col-md-2">
<label for="firstname">Father Last Name</label>
{{form.father_last_name}}
</div>
<div class="form-group col-md-2">
<label for="middlename">Father First Name</label>
{{form.father_first_name}}
</div>
<div class="form-group col-md-2">
<label for="lastname">Father Middle Name</label>
{{form.father_middle_name}}
</div>
<div class="form-group col-md-2">
<label for="emailadd">Occupation</label>
{{form.father_occupation}}
</div>
<div class="form-group col-md-1">
<label for="contact">Age</label>
{{form.father_age}}
</div>
<div class="form-group col-md-2">
<label for="contact">Father Tel No.</label>
{{form.father_telno}}
</div>
</div>
<div class="form-row">
<div class="form-group col-md-2">
<label for="firstname">Mother Last Name</label>
{{form.mother_last_name}}
</div>
<div class="form-group col-md-2">
<label for="middlename">Mother First Name</label>
{{form.mother_first_name}}
</div>
<div class="form-group col-md-2">
<label for="lastname">Mother Middle Name</label>
{{form.mother_middle_name}}
</div>
<div class="form-group col-md-2">
<label for="emailadd">Occupation</label>
{{form.mother_occupation}}
</div>
<div class="form-group col-md-1">
<label for="contact">Age</label>
{{form.mother_age}}
</div>
<div class="form-group col-md-2">
<label for="contact">Mother Tel No.</label>
{{form.mother_telno}}
</div>
</div>
<div class="form-row">
<div class="form-group col-md-2">
<label for="firstname">Sibling Last Name</label>
{{form.siblings_last_name}}
</div>
<div class="form-group col-md-2">
<label for="middlename">Sibling First Name</label>
{{form.siblings_first_name}}
</div>
<div class="form-group col-md-2">
<label for="lastname">Sibling Middle Name</label>
{{form.siblings_middle_name}}
</div>
<div class="form-group col-md-2">
<label for="emailadd">Occupation</label>
{{form.siblings_occupation}}
</div>
<div class="form-group col-md-1">
<label for="contact">Age</label>
{{form.siblings_age}}
</div>
<div class="form-group col-md-2">
<label for="contact">Sibling Tel No.</label>
{{form.siblings_telno}}
</div>
</div>
<div class="form-row">
<div class="form-group col-md-2">
<label for="firstname">Sibling Last Name</label>
{{form.siblings2_last_name}}
</div>
<div class="form-group col-md-2">
<label for="middlename">Sibling First Name</label>
{{form.siblings2_first_name}}
</div>
<div class="form-group col-md-2">
<label for="lastname">Sibling Middle Name</label>
{{form.siblings2_middle_name}}
</div>
<div class="form-group col-md-2">
<label for="emailadd">Occupation</label>
{{form.siblings2_occupation}}
</div>
<div class="form-group col-md-1">
<label for="contact">Age</label>
{{form.siblings2_age}}
</div>
<div class="form-group col-md-2">
<label for="contact">Sibling Tel No.</label>
{{form.siblings2_telno}}
</div>
</div>
<div class="form-row">
<div class="form-group col-md-2">
<label for="firstname">Sibling Last Name</label>
{{form.siblings3_last_name}}
</div>
<div class="form-group col-md-2">
<label for="middlename">Sibling First Name</label>
{{form.siblings3_first_name}}
</div>
<div class="form-group col-md-2">
<label for="lastname">Sibling Middle Name</label>
{{form.siblings3_middle_name}}
</div>
<div class="form-group col-md-2">
<label for="emailadd">Occupation</label>
{{form.siblings3_occupation}}
</div>
<div class="form-group col-md-1">
<label for="contact">Age</label>
{{form.siblings3_age}}
</div>
<div class="form-group col-md-2">
<label for="contact">Sibling Tel No.</label>
{{form.siblings3_telno}}
</div>
</div>
</div>
<button id="previous_personal">Previous</button>
<button id="next_educational">Next</button>
</div>
<input type="submit" value="submit">
</div>
答案 0 :(得分：0)
您需要将所有内容都包含在初始<form>标记内。目前，您的表单的第二部分位于<form></form>之外，因此提交时没有任何反应。
答案 1 :(得分：0)
第二组表单字段不在<form>中，因此它不会对表单提交执行任何操作。您要么将其添加到当前表单中，要么将其包装在另一个表单标签中并分别处理提交。某种类型的Ajax在这里可能会派上用场，甚至在django中使用部分模板并将部分模板作为表单的一部分，然后，如果您获得成功的响应，则可以显示下一个表单并将其作为几乎完全独立的表单来处理。提交表单时，您还可以在开发工具中检查“网络”选项卡，然后单击刚发送的请求，然后转到“参数”选项卡，查看在表单提交中发送了哪些参数及其值。我知道这不是直接的答案，但希望它可以帮助您进行更多调试。