jQuery UI datepicker без текстового поля

Возможно ли использовать jQuery UI datepicker без текстового поля? Я просто хочу иметь значок календаря, который при нажатии показывает элемент управления календарем. Затем, когда выбрана дата, элемент управления должен исчезнуть. Затем я просто хочу записать выбранную дату и передать ее в свою собственную функцию javascript.jQuery UI datepicker без текстового поля

Я пробовал использовать его с пролетами и divs, но поведение все не так. Он не скрывает, когда пользователь выбирает дату. Если я приложу его к скрытому полю, как предположили некоторые, датупик не может быть запущен.

источник

2013-05-10 Legion

Это может помочь: [Открыть JQuery Datepicker, щелкнув изображение без поля ввода] (http://stackoverflow.com/questions/1112035/open-jquery-datepicker-by-clicking-on-an-image -w-no-input-field /) – nnnnnn

Спасибо. К сожалению, я начал и попробовал все перечисленные там стратегии безрезультатно. – Legion

Вы можете использовать опцию «ShowOn» для использования datepicker с иконкой.

$(function() { 
    $("#datepicker").datepicker({ 
     showOn: "button", 
     buttonImage: "images/calendar.gif", 
     buttonImageOnly: true, 
     onSelect:function(selectedDate){ 
       your_function(selectedDate); 
     } 

    }); 
    });

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

источник

2013-05-10 22:24:42

К сожалению, если datepicker не является текстовым полем (чего я не хочу), поведение неверно. Если я сделаю datepicker div/span, тогда календарь не исчезнет после выбора даты. – Legion

вы можете скрыть поле ввода. –

Добавление onSelect разбивает его. Никакой datepicker не видно, как только я добавляю onSelect. Вы уверены, что это не устарело? – Legion

Вот решение, которое у меня есть.

Fiddle:

http://jsfiddle.net/qphza/1/

// Set up datepicker toggle functionality 

$("#datepicker").hide(); 

$("#buttonHere").click(function(){ 

    $("#datepicker").toggle(); 
}); 

$("#datepicker").datepicker({ 
     onSelect: function(value, date) { 
     alert('The chosen date is ' + value); 

     // Hide the datepicker div when something is selected 

     $("#datepicker").hide(); 
     } 
});

Вот HTML

<button id = "buttonHere">Click to show datepicker</button> 

<div id = "datepicker"></div>

источник

2013-05-10 22:33:18 turnt

Что связано с HTML? – Barmar

@Barmar Его в ссылке JsFiddle – turnt

Вы должны включить его в ответ, скрипка предназначена только для демонстрационных целей. – Barmar

Вы можете назначить DatePicker к скрытому входу, а затем просто назначить выбранную дату, что вам нужно его например метка.

$('#hiddenInput').datepicker({ 
    showOn: 'button', 
    buttonImage: 'http://jqueryui.com/resources/demos/datepicker/images/calendar.gif', 
    buttonImageOnly: true, 
    onSelect: function (selectedDate) { 
     $('#calendarDay').text(selectedDate); 
     $('#hiddenInput').datepicker('destroy'); 
    } 
});

Это jsFiddle показывает, что:

http://jsfiddle.net/pxeFM/8/

источник

2013-05-10 22:35:51 sergioadh

бы использовать кладж, но я получил его на работу. Вот jQuery.

$(function() { 
    $("#datepicker").datepicker({ 
     showOn: "button", 
     buttonImage: "btn_calendar.gif", 
     buttonImageOnly: true, 
     onSelect:function(selectedDate){ 
       alert(selectedDate); 
     } 
    }); 
    });

Вот HTML.

<input type="text" id="datepicker" size="1" readonly style="outline: none; color: #FFFFFF; border: 0px solid #000000;"/>

В основном я сделал текстовое поле невидимым и readonly, фактически не «скрывая» его. Но поведение работает. Кажется, это единственный способ получить дампикер без видимого текстового поля.

источник

2013-05-10 22:53:06 Legion

jQuery UI datepicker без текстового поля

ответ

Смежные вопросы