Кому интересно нашла способ добавить выпадающий календарь к форме.
Идёте сюда:
http://jqueryui.com/datepicker/#default.
Перед тегом </head> в index вашего шаблона добавляете:
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css"> - я скачала CSS и создала свои настройки оформления
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script>
$(function() {
$('div#Вашеназвание div.qftext input').attr('id', 'datepicker');
$('div#Вашеназвание div.qftext input').removeClass('inputbox');
$( "#datepicker" ).datepicker();
});
</script>
На сайте ttp://jqueryui.com/datepicker/#default есть разные настройки для календаря (эффекты и т.д.)
В создаваемой форме делаете три поля: Два separator и между ними text
В первом separator:
<div id="Вашеназвание">
Далее поле текст:Дата (или любой Ваш заголовок поля)
separator: </div>
Всё. Календарик выпадает. Дата подставляется. Дата приходит на почту!
Еще вариант. Также перед </head>
<link rel="stylesheet" type="text/css" href="Ваш шаблон/css/jquery.datetimepicker.css"/>
<script src="Ваш шаблон/js/jquery.js" type="text/javascript"></script>
<script src="Ваш шаблон/js/jquery.datetimepicker.js" type="text/javascript"></script>
<script>
$(function() {
$('div#date input').attr('id', 'datetimepicker');
$('div#time input').attr('id', 'datetimepicker2');
});
</script>
<script>
$(function() {
$( "#datetimepicker" ).datetimepicker({
lang:'ru',
timepicker:false
});
$( "#datetimepicker2" ).datetimepicker({
datepicker:false,
format:'H:i',
step:5
});
});
</script>
Варианты отображения здесь:
http://xdsoft.net/jqplugins/datetimepicker/. Можно поставить дату и время, только дату, только время и т.д. Под каждое поле должен быть свой id и, каждое поле должно быть обернуто в свой div (или span, или p. То есть то, к чему привязать id)