我正在尝试进行 ajax 调用(在 django 中)以根据另一个的选定项填充我的网页上的选择框。我是 python、django 和 jquery/javascript 的新手,所以我不太惊讶它不起作用。
我有以下form.py
class InputParametersForm(forms.ModelForm):
sqlConnection = SQLSeverConnection('MSSQLServerDataSource')
tableNames = {}
sqlQuery = sqlConnection.getTableNames()
tableNames = tuple((table, table) for table, in sqlQuery)
tableNames = tuple((str(table), str(table)) for table, in sqlQuery)
tableNames = tuple((table.encode(), table.encode()) for table, in sqlQuery)
TableName = forms.ChoiceField(widget=forms.Select(),
choices=tableNames)
ColumnName = forms.ChoiceField(widget=forms.Select())
StartDateTime = forms.DateField(widget=SelectDateWidget())
EndDateTime = forms.DateField(widget=SelectDateWidget())
class Meta:
model = SelectionHistory
fields = ("TableName", "ColumnName", "StartDateTime", "EndDateTime")
并查看;
def InputParametersView(request):
context = RequestContext(request)
connection = SQLSeverConnection('MSSQLServerDataSource')
if request.method == 'POST':
pdb.set_trace()
if form.is_valid():
form.save(commit=True)
ChartData.objects().all().delete()
this_XData = connection.getColumnData('DateTimeStamp', SelectionHistory.TableName[0], SelectionHistory.StartDateTime[0], SelectionHistory.EndDateTime[0])
this_YData = connection.getColumnData(SelectionHistory.ColumnName[0], SelectionHistory.TableName[0], SelectionHistory.StartDateTime[0], SelectionHistory.EndDateTime[0])
ChartData.XData = this_XData
ChartData.YData = this_YData
ChartData.save()
elif request.method == 'GET':
pdb.set_trace()
if request.is_ajax():
pdb.set_trace()
selected_table = request.GET['selected_table']
columns = connection.getColumnTitles(selected_table)
column_names = {}
column_names = tuple((column, column) for column, in columns)
column_names = tuple((str(column), str(column)) for column, in columns)
column_names = tuple((column.encode(), column.encode()) for column, in columns)
return HttpResponse(column_names)
return render_to_response('input_parameters-ajax.html', {'form': InputParametersForm}, context)
以及以下模板 - 包含脚本;
<html>
{% load staticfiles %}
<title>Input Parameters</title>
<script src="{% static 'dgconnection/js/jquery-2.1.0.min.js' %}"></script>
<script src="{% static 'dgconnection/bootstrap/js/bootstrap.min.js' %}"></script>
<script>
$("#id_TableName").change(function()
{
tableSelectionChanged();
})
function tableSelectionChanged()
{
var selected_table = $("#id_TableName").selectedIndex;
$.get('/historicaldata/input_parameters/', {selected_table : selected_table}, function(column_names){
$("#id_ColumnName').val(column_names);
});
}
</script>
<body>
<h1>What would you like to see?</h1>
<form id="input_parameters" method="post" action="http://127.0.0.1:8000/historicaldata/chart_view/">
{% csrf_token %}
<ul>
{{form.as_ul}}
</ul>
<input type="submit" value="submit" />
</form>
</body>
更改顶部后,我得到以下网页,下部选择框没有任何内容;