JQuery UI Datepicker на изображении

Question

Привет,

Я хочу открыть Jquery Datepick, когда изображение щелкается и отображается рядом с ним.Как только дата нажата, я хочу опубликовать свою форму.

Вот как я пытаюсь это сделать:

HTML:

<form id="myform">
<span class="quickgo">
Quick Go:
<select>
<option value="1">Discovery Channel</option>
<option value="2">History Channel</option>
</select>
<img class="calenderpick" src="/img/calender.png" />
</form>

И часть JavaScript:

<script type="text/javascript">
$(function() {
    $(".calenderpick").click(function() {
      $(this).datepicker();
      alert("it is clicked!");
    });           
});
</script>

После того, как вы нажмете на это изображение, я получу «предупреждение о нажатии», но не указатель даты.Я также не имею ни малейшего понятия о том, как вызвать событие отправки формы после выбора даты.В конце я хочу опубликовать выбранный канал и выбранную дату, чтобы я мог переключить страницу.

Спасибо

Answer 1

Hellnar,

вот что я регулярно использую в своих приложениях mvc:

<input class="date" id="StartDate" name="StartDate" value="" type="hidden" />

<script type="text/javascript">
    $(document).ready(function() {
    $("#StartDate").datepicker({
            dateFormat: 'dd-mm-yy',
            changeMonth: true,
            changeYear: true,
            showOn: 'button',
            buttonImage: '/img/calender.png'
        });
    });
</script>

надеюсь, это поможет (обратите внимание, я использую идентификатор, а не селектор класса). также проверьте орфографию на каландре - должен быть calend a r:)

edit - если вы хотите отправить форму при выборе даты, измените код javascript на:

<script type="text/javascript">
    $(document).ready(function() {
    $("#StartDate").datepicker({
            dateFormat: 'dd-mm-yy',
            changeMonth: true,
            changeYear: true,
            showOn: 'button',
            buttonImage: '/img/calender.png',
            onSelect: function(dateText, inst) { $("#myform").submit(); }
        });
    });
</script>

Answer 2

• Почему его не открывается при нажатии на изображение

Просмотрите источник здесь JQuery Datepicker Icon Trigger

• Какопубликуйте форму для выбора даты

Просмотрите источник здесь События JQuery Datepicker - onSelect

В событии onSelect вы можете сделать что-то вроде $("#form").submit()

Надеюсь, это поможет