JQuery UI Datepicker: Создание активной ссылки

Question

извините за плохой английский

Это необходимо для меня, что при щелчке по ссылке (образец: 28 April 2010), под ним jquery.datepicker открыл

Чтобы использовать <a></a> вместо <input type="text" />

Answer 1

<a class="date-picker" href="#">10/10/2010</a> 

$(function() { 
function onSelect(date) { 
    alert(date); 
} 

function openDatePicker() { 
    element = $(this) 
    offset = [element.offset().left, element.offset().top + element.height()] 
    element.datepicker("dialog", $(this).text(), onSelect, {}, offset) 
    } 

    $(".date-picker").click(openDatePicker); 
}); 

Answer 2

В приложении MVC, ваш код может быть:

XML:

<div class="editor-field"> 
     <%= Html.TextBoxFor(model => model.DOB, new { @class = "date-picker" })%> 
     <%= Html.ValidationMessageFor(model => model.DOB, "*") %> 
    </div> 

Что сделает, как (это то, что это будет выглядеть как обычный старый .html):

<div class="editor-field"> 
    <input class="date-picker hasDatepicker" id="DOB" name="DOB" type="text" value=""> 
</div> 

JQuery (предполагая, у вас есть библиотека JQuery и библиотеки JQuery UI в расположение показано ниже):

<script id="script3" src="/Scripts/jquery-1.4.2.min.js" type="text/javascript"></script> 
<script id="script4" src="/jQueryUI/jquery-ui-1.8.2.custom.min.js" type="text/javascript"></script> 
<script id="script2" src="/jQueryUI/ui/jquery.ui.core.min.js" type="text/javascript"></script> 
<script id="script1" src="/jQueryUI/ui/jquery.ui.datepicker.min.js" type="text/javascript"></script> 

<script type="text/javascript"> 
     $(document).ready(function() { 
      $('.date-picker').live('click', function() { 
       $(this).datepicker({ showOn: 'focus', changeMonth: true, changeYear: true, yearRange: "-130:+0" }).focus(); 
      }); 
     }); 
</script> 

в приведенной выше коде, у вас есть целый ряд вспомогательных установок, например, чтобы показать последние 130 лет (по дате рождения) и кнопкам/выпадающий список, чтобы чан месяц и год.

Вы можете найти эти параметры документированы: jQuery Date Picker Documentation