wordpress 联系表格 7 Datepicker，日期范围介于 2 个日期之间
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18515921/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Contact form 7 Datepicker, date range between 2 dates
提问by SiteHopper
I would like to have two date field in my Wordpress contact form 7. A start-date and an end-date. The fields will be datepickers from the "Contact Form 7 Datepicker" plugin. When visitor has selected a start-date he should only be able to select an end date that is 4 days later then the start-date.
我想在我的 Wordpress 联系表单 7 中有两个日期字段。开始日期和结束日期。这些字段将是“Contact Form 7 Datepicker”插件中的日期选择器。当访问者选择了开始日期时，他应该只能选择比开始日期晚 4 天的结束日期。
How can I achieve this by only using the "contact form 7" form creator?
如何仅使用“联系表单 7”表单创建者来实现此目的？
回答by SiteHopper
This is the syntax I put in the "contact form 7".
这是我放在“联系表格 7”中的语法。
Start date charter*:
[date* date-start date-format:MM_d_yy]
End date charter*:
[date* date-end date-format:MM_d_yy]
And I added this code to the end of the functions file of the Wordpress theme.
我将此代码添加到 Wordpress 主题的函数文件的末尾。
function calendar_js(){
?>
<script>
jQuery(function($){
var start = $('.date-start input').first();
var end = $('.date-end input').first();
start.on('change', function() {
var start_date = $(this).datepicker('getDate');
start_date.setDate(start_date.getDate() + 3);
end.datepicker('option', 'minDate', start_date);
});
});
</script>
<?php
}
add_action('wp_footer', 'calendar_js');
Now the second date picker must be at least 4 days later then the first date picker.
现在第二个日期选择器必须比第一个日期选择器晚至少 4 天。
回答by Mangesh Parte
May be this plugin will help you. This plugin works along with CF 7
可能这个插件会帮助你。这个插件与 CF 7 一起工作
http://wordpress.org/plugins/contact-form-7-datepicker/
http://wordpress.org/plugins/contact-form-7-datepicker/
And you can add your own javascript for date manipulation after adding datepicker in CF 7.
在 CF 7 中添加 datepicker 后，您可以添加自己的 javascript 进行日期操作。
Example:
例子：
jQuery(document).ready(function($) {
$( ".from" ).datepicker({
onClose: function( selectedDate ) {
$( "#to" ).datepicker( "option", "minDate", selectedDate );
}
});
$( ".to" ).datepicker({
onClose: function( selectedDate ) {
$( "#from" ).datepicker( "option", "maxDate", selectedDate );
}
});
});
