Возникли проблемы с несколькими JQuery UI DatePickers

Question

У меня есть один JQuery UI DatePicker работает нормально. Теперь я добавляю второй (чтобы иметь дату начала и дату окончания), и когда я щелкаю во втором текстовом поле, всплывающее окно выбора даты первого текстового поля появляется (вместо второго).

кто-нибудь видел это или знал о каких-либо других причудах при наличии нескольких сборщиков дат:

вот мой код:

JavaScript:

<script type="text/javascript">
    $(document).ready(function () {
        $('#startDate').datepicker({ dateFormat: 'dd M yy' } );
        $('#endDate').datepicker({ dateFormat: 'dd M yy' } );
    });
</script>

HTML:

<label>Date Range: Start  <%= Html.TextBox("StartDate", Model.StartDate.ToString("dd-MMM-yyyy"), new Dictionary<string, object> { { "id", "startDate" }, { "maxlength", 12 }, { "size", 12 } })%> End  <%= Html.TextBox("EndDate", Model.EndDate.ToString("dd-MMM-yyyy"), new Dictionary<string, object> { { "id", "endDate" }, { "maxlength", 12 }, { "size", 12 } })%> </label>

, который генерирует (из источника просмотра)

 Start  <input class="hasDatepicker" id="startDate" maxlength="12" name="StartDate" size="12" value="01-Jan-0001" type="text">

End  <input class="hasDatepicker" id="endDate" maxlength="11" name="EndDate" size="11" value="01-Jan-0001" type="text"> 

Answer 1

Этот ответ устарел, поскольку ОП отредактировал свой вопрос.

Не используйте "hasDatepicker" в качестве имени класса, оно используется внутри JQuery, и использование его самостоятельно портит ситуацию Просто переименуйте имя класса, и все будет в порядке.

Answer 2

Я разобрался с вопросом: получается, что

<label>

Тег

был рядом с обоими сборщиками даты, и когда я удалил

<label>

Тег

теперь работает.