我目前正在尝试使用graphjs在我的网站上动态加载图表 . 我想要做的是通过选择时间范围或特定数据类型来更新数据 . 我希望它更灵活,只有两个观点;一个用于渲染图形,另一个用于返回相关数据 . 我认为我的日期小部件将使用post方法通过HomeView传递数据 . 如何将日期信息传递给GenericDataView?或许还有另一种方法可以做这种事情 .
EDIT :
class HomeView(View):
def get(self,request,*args,**kwargs):
return render(request,'charts/charts.html')
class GenericDataView(APIView):
def get(self,request,*args,**kwargs):
selected_data = getDataFromTimeRange()
if selected_data is not None:
return Response(selected_data)
if request.method == 'POST':
form = DatePickerCustom(request.POST)
if form.is_valid():
mydate = form.cleaned_data('production_day')
print("DATE: ", mydate)
else:
form = DatePickerCustom()
def getDataFromTimeRange():
// do things
return data;
在forms.py中:
dateCustomInput = DateInput(attrs={'class':'datepicker'})
class DatePickerCustom(Form):
production_day = DateField(label='Production day',widget=dateCustomInput)
在charts.hmtl中:
function csrfSafeMethod(method) {
// these HTTP methods do not require CSRF protection
return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
}
$.ajaxSetup({
beforeSend: function(xhr, settings) {
if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
console.log(xhr)
console.log(csrftoken)
xhr.setRequestHeader("X-CSRFToken", csrftoken);
console.log(X-CSRFToken)
}
}
});
<div class="chart-container" url-endpoint='{% url "api-data" %}' style="position: relative">
<canvas id="myChart"></canvas>
</div>
<form action="chart" method="post" enctype='multipart/form-data'>
<!-- {{ csrf_input }}-->
{% csrf_token %}
<label for="date">Choose a date: </label>
<input id="datepicker" type="text" name="selectedDate" value="{{ form }}">
<input type="submit" value="OK">
</form>