我正在使用Django表单向导填写多步骤表单,将其输入并保存到数据库中,但所有问题都是我使用“上一个”浏览步骤时看到的清晰字段里面没有数据。我只想在回去时将数据显示在那里以供参考。
这是我的表格。py
`class AppEditForm(forms.Form):
#App Name
applicationfullname = forms.CharField(label='Application Full Name: ', max_length=80, required = False)
#Full Name
applicationabbreviatedname = forms.CharField(label='Application Abbreviated Name: ', max_length=40, required = False)
class AppEditForm1(forms.Form):
#Business Sponser
businesssponsoredwpersonid = forms.CharField(widget= autocomplete.Select2(url='WorkerDim_ac', attrs={'data-placeholder': 'Search values', 'data-width': '25em'}), required = False, label="Business Sponsor Name: ")
#Application Owner
applicationowneredwpersonid = forms.CharField(widget= autocomplete.Select2(url='WorkerDim_ac', attrs={'data-placeholder': 'Search values', 'data-width': '25em'}), required = False, label='Application Owner Name: ')
#Business Owner
businessowneredwpersonid = forms.CharField(widget= autocomplete.Select2(url='WorkerDim_ac', attrs={'data-placeholder': 'Search values', 'data-width': '25em'}), required = False, label='Business Owner Name: ')
`
这是我的html
<!DOCTYPE html>
{% extends "newapp/base.html" %}
{% load i18n static %}
{% load staticfiles %}
{% load crispy_forms_tags %}
{% block title %}Addapplication{% endblock title %}
{% block head %}
{{ wizard.form.media }}
<link rel="stylesheet" href="{% static 'css/addapplication.css' %}">
<script type='text/javascript'>function formProcess(){
var capture = document.forms['input']['id_1applicationfullname'].value + '<br>';
capture += document.forms['input']['id_1applicationabbreviatedname'].value + '<br>';
capture += document.forms['input'][''].value + '<br>';
capture += document.forms['input'][''].value + '<br>';
document.getElementById('outputDiv').innerHTML = capture;
}
</script>
{% endblock %}
{% block body_block%}
<div class="container">
<div class="jumbotron" id=tablet>
<div class="container" style="text-align: center">
<h2>Add Application</h2>
</div>
<form method="post" >
<div class="row drpClass">
<div class="container" id="outputDiv">
<ul class="nav nav-tabs" id="myTab" role="tablist">
<li class="nav-item">
<a class="nav-link text-center {% if wizard.steps.current == '1' %} active {% endif %}" name='wizard_goto_step' value = '1' style="margin-top: 5px; margin-left: 5px; padding-left: 8px; padding-right: 8px; border: 2px;" role="tab"><i class="fa fa-info-circle"></i><p>Application Info</p></a>
</li>
<li class="nav-item">
<a class="nav-link text-center {% if wizard.steps.current == '2' %} active {% endif %}" name='wizard_goto_step' value = '2' style="margin-top: 5px; margin-left: 5px; padding-left: 8px; padding-right: 8px; border: 2px;" role="tab"><i class="fa fa-id-card"></i><p>Ownership</p></a>
</li>
<li class="nav-item">
<a class="nav-link text-center {% if wizard.steps.current == '3' %} active {% endif %}" name='wizard_goto_step' value = '3' style="margin-top: 5px; margin-left: 5px; padding-left: 8px; padding-right: 8px; border: 2px;" role="tab"><i class="fa fa-area-chart"></i><p>Application Type</p></a>
</li>
<li class="nav-item">
<a class="nav-link text-center {% if wizard.steps.current == '4' %} active {% endif %}" name='wizard_goto_step' value = '4' style="margin-top: 5px; margin-left: 5px; padding-left: 8px; padding-right: 8px; border: 2px;" role="tab"><i class="fa fa-table"></i><p>Application Details</p></a>
</li>
<li class="nav-item">
<a class="nav-link text-center {% if wizard.steps.current == '5' %} active {% endif %}" name='wizard_goto_step' value = '5' style="margin-top: 5px; margin-left: 5px; padding-left: 8px; padding-right: 8px; border: 2px;" role="tab"><i class="fa fa-life-ring"></i><p>Application Support</p></a>
</li>
<li class="nav-item">
<a class="nav-link text-center {% if wizard.steps.current == '6' %} active {% endif %}" name='wizard_goto_step' value = '6' style="margin-top: 5px; margin-left: 5px; padding-left: 8px; padding-right: 8px; border: 2px;" role="tab"><i class="fa fa-usd"></i><p>Application Cost</p></a>
</li>
<li class="nav-item">
<a class="nav-link text-center {% if wizard.steps.current == '7' %} active {% endif %}" name='wizard_goto_step' value = '7' style="margin-top: 5px; margin-left: 5px; padding-left: 8px; padding-right: 8px; border: 2px;" role="tab"><i class="fa fa-certificate"></i><p>Application License / Users</p></a>
</li>
<li class="nav-item">
<a class="nav-link text-center {% if wizard.steps.current == '8' %} active {% endif %}" name='wizard_goto_step' value = '8' style="margin-top: 5px; margin-left: 5px; padding-left: 8px; padding-right: 8px; border: 2px;" role="tab"><i class="fa fa-handshake-o"></i><p>Application Vendor</p></a>
</li>
<li class="nav-item">
<a class="nav-link text-center {% if wizard.steps.current == '9' %} active {% endif %}" name='wizard_goto_step' value = '9' style="margin-top: 5px; margin-left: 5px; padding-left: 8px; padding-right: 8px; border: 2px;" role="tab"><i class="fa fa-code"></i><p>Application Version</p></a>
</li>
<li class="nav-item">
<a class="nav-link text-center {% if wizard.steps.current == '10' %} active {% endif %}" name='wizard_goto_step' value = '10' style="margin-top: 5px; margin-left: 5px; padding-left: 8px; padding-right: 8px; border: 2px;" role="tab"><i class="fa fa-rocket"></i><p>Application Functionality</p></a>
</li>
<li class="nav-item">
<a class="nav-link text-center {% if wizard.steps.current == '11' %} active {% endif %}" name='wizard_goto_step' value = '11' style="margin-top: 5px; margin-left: 5px; padding-left: 8px; padding-right: 8px; border: 2px;" role="tab"><i class="fa fa-rocket"></i><p>MISC</p></a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane active" role="tabpanel">
<div class="card" id="steps_Card">
<div class="card-header">Step {{ wizard.steps.step1 }} of {{ wizard.steps.count }}</div>
<div class="card-body">
<div class="row">
<div class="col">
<div class="form-group">
<table class="tbl-fix table-condensed">
{{ wizard.management_form }}
{% csrf_token %}
{% if wizard.form.forms %}
{{ wizard.form.management_form }}
{% for form in wizard.form.forms %}
{{ form | crispy }}
{% include 'bootstrap4/layout/help_text_and_errors.html' %}
{% endfor %}
{% else %}
{% if wizard.steps.current == '2' %}
{{ wizard.form }}
{% elif wizard.steps.current == '5' %}
{{ wizard.form }}
{% else %}
{{ wizard.form | crispy }}
{% endif %}
{% endif %}
</table>
{% if wizard.steps.prev %}
<button class="btn btn-primary bg-dark" name="wizard_goto_step" type="submit" value="{{ wizard.steps.first }}">{% trans "First step" %}</button>
<button class="btn btn-primary bg-dark" id="previousBtn" name="wizard_goto_step" type="submit" value="{{ wizard.steps.prev }}">{% trans "Prev step" %}</button>
{% endif %}
{% block savebtn %}
<input type="submit" class='btn btn-primary pull-right bg-dark' onclick="formProcess()" name="wizard_goto_step" value="{% trans 'Save' %}" style="border-radius: 25px; width: 70px"/>
{% endblock %}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
{% endblock body_block%}
所以我尝试在顶部使用此javascript,但无法正常工作。 我是新来的编码。请帮助我解决问题。谢谢