CODEWITHSUNDEEP
jquery-uijquery-ui-datepicker
Laxmidi
Laxmidi

Reputation: 2684

Simple Question About the jQuery Datepicker's Calendar Icon

Sorry for the simple question.

I'm using a jQuery DatePicker. I want the little calendar icon to appear next to the text input area. I'm using the Smoothness jQuery UI theme.

Does jQuery UI include the calendar.gif icon (not the datepicker itself, but just the little icon)? If not, can you suggest where I can get a free small calendar.gif?

As I understand it, I add the calendar as follows: buttonImage: 'images/calendar.gif'

Thank you.

Upvotes: 4

Views: 8258

Answers (3)

劉鎮瑲
劉鎮瑲

Reputation: 597

Just go to JQueryUI site then click Demo and choose Dateicker and select icon trigger example. You will on this page(datepicker icon-trigger example), and the page will look like below picture. enter image description here

Now you right click on the calendar icon marked by yellow and download it by choose "Save Image As..." and include it in your project than buttonImage: 'images/calendar.gif' will work fine.

Upvotes: 0

William Niu
William Niu

Reputation: 15853

You could use the built in icons from jQuery UI; there is a calendar icon. The code is something like:

$("#datepicker").datepicker({
    showOn: 'button'
}).next('button').text('').button({
    icons: {
        primary: 'ui-icon-calendar'
    },
    text: false
});

See it in action: http://jsfiddle.net/william/rrcmq/.

It is inspired by this article: http://www.somethinghitme.com/2010/10/06/use-built-in-jquery-ui-icon-with-datepicker/.

Upvotes: 6

jk.
jk.

Reputation: 14435

I far as I know it does not. I provided my own when I used the datepicker with one but I already had an icon.

You can google it but there are some free icons here: http://findicons.com/search/calendar

Upvotes: 1

Related Questions