我还是Django的新手(大约2周)。在过去的几天中,我一直在努力将html文件中的字符串传递给表单。我的项目允许用户从下拉菜单中选择一种状态(目前为密歇根州和俄亥俄州,我将在稍后添加其余部分)。选择州时,它将使用该字符串并从电子表格中提取该州的县列表。这就是问题所在。我进行了广泛搜索,但似乎找不到解决方法。这些解决方案的主要障碍是我不想通过按钮“提交”。我希望用户“选择”一个州,然后选择一个没有页面刷新的县。我还提供了该网页的屏幕截图。到目前为止,借助youtube教程,依赖下拉列表可以完美运行。图片中的“提交”按钮目前尚不美观。
预先感谢您的帮助。如果您对模型有疑问或对代码有其他疑问,请告诉我。
views.py
def StateForm_Page(request):
context = {}
stateChoice = 'Michigan' //hardcode a state so if the post fails, the function can still find an excel sheet
if request.method == 'POST':
State_Form = StateForm(request.POST)
stateChoice = State_Form.cleaned_data['stateChoice'] //I think this is where my code is failing
else:
State_Form = StateForm()
context['State_Form'] = State_Form
dataArray = pd.read_excel(r'C:\filename.xls', sheet_name= stateChoice)
county_strings = dataArray['County '].values.tolist()
json_county_strings = json.dumps(county_strings)
context['json_county_strings'] = json_county_strings
return render(request, 'StateForm_page.html', context)
StateForm_page.html
<body>
<form action="" method="POST" name="stateChoice">
{% csrf_token %}
{{ State_Form.as_p }}
</form>
<script>
var state;
var county;
$(document).ready(function(){
$('#id_county').empty(); //empties county before state is chosen
$("#id_state").on('change', function(){ //when #id_state is changed...
state = $("#id_state").val(); //assign state with the selection
var countyStrings = JSON.parse('{{ json_county_strings | escapejs }}'); //grabs counties from respective state
var length = countyStrings.length;
var i;
for(i=0; i < length; i++){
county = countyStrings[i]; //update county options with spreadsheet values
$('#id_county').append(
`
<option value ="${county}">
${county}
</option>
`
);
}
});
})
}
</script>
</body>
到目前为止该网页的外观:
第二天更改
嘿,多花了几个小时之后,我仍然没有运气。根据您的建议,以下是我添加的内容 views.py
def retrieveState(request):
statePick = request.GET.get('state')
return JsonResponse(statePick, safe = False)
def StateForm_Page(request):
context = {}
stateChoice = []
if request.method == 'POST':
#stateChoice = State_Form.cleaned_data['stateChoice']
State_Form = StateForm(request.POST)
stateChoice = retrieveState(request)
else:
stateChoice = 'Michigan'
State_Form = StateForm()
StateForm_Page.html
$.ajax({
type: 'POST',
url: 'ajax/retrieveState/',
data: state,
dataType: 'json',
});