链接到package/app/任意名称:http://foundation-datepicker.peterbeno.com/example.html
所以我有一个表单在我的HTML文件称为dp-form和里面有一个文本输入称为dp与属性name="datepicker"。我知道日期选择器和表单是有效的，因为当我选择一个日期并使用提交按钮时，一切都如预期的那样工作，然而，不幸的是，我野心勃勃，决定尝试让jQuery处理发布和提交，导致我在HTML文件末尾看到以下代码:
<script>
$('#dp').fdatepicker(format='yyyy-mm-dd')
.on('changeDate', function(event) {
var pickedDate = $("#dp").val();
$.ajaxSetup( {data: {csrfmiddlewaretoken: '{{ csrf_token }}'}} );
$.ajax({
url: "/index/",
method: "POST",
data: {'datepicker': pickedDate, 'routepicker': "default"}
});
});
$("#dp-form").submit();
</script>
问题是，一旦我加载包含的页面，它从一个空的表单(没有被点击，日期选择器还没有打开，什么都没有完成)，并提交它，然后继续这样做。它被困在一个无限循环中这样做，我的页面不断重新加载，因为它不断提交空数据。
在每次页面加载时提交表单:
$("#dp-form").submit();
你应该在'changeDate'事件处理程序中调用它:
$('#dp').fdatepicker(format='yyyy-mm-dd')
.on('changeDate', function(event) {
var pickedDate = $("#dp").val();
$("#dp-form").submit();
});
如果你想用ajax发送表单，你可以使用jQuery表单插件
<html>
<script>
// wait for the DOM to be loaded
$(document).ready(function() {
$('#dp').fdatepicker(format='yyyy-mm-dd')
.on('changeDate', function(event) {
var pickedDate = $("#dp").val();
$("#dp-form").submit();
});
// bind 'dp-form' and provide a simple callback function
$('#dp-form').ajaxForm(function() {
alert("Thank you for posting");
});
});
//You'll also need this snippet in order to not struggle with csrftoken in Django :
$(function() {
function getCookie(name) {
var cookieValue = null;
if (document.cookie && document.cookie != '') {
var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) {
var cookie = jQuery.trim(cookies[i]);
// Does this cookie string begin with the name we want?
if (cookie.substring(0, name.length + 1) == (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
}
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) {
xhr.setRequestHeader("X-CSRFToken", getCookie('csrftoken'));
}
}
});
});
</script>