I have a web application that uses HTML and Javascript. I want to create a textbox that allows to user to enter in a keyword and submit it. I also want a little calendar icon next to the textbox so the user can click on it to popup a calendar to select a date as the keyword, and then submit that.

I have tried to implement Jcalendar and DatePicker but couldn't get either one working.

Is there something that I can use that will meet my needs? Thank you!

I have a web application that uses HTML and Javascript. I want to create a textbox that allows to user to enter in a keyword and submit it. I also want a little calendar icon next to the textbox so the user can click on it to popup a calendar to select a date as the keyword, and then submit that.

I have tried to implement Jcalendar and DatePicker but couldn't get either one working.

Is there something that I can use that will meet my needs? Thank you!

• javascript
• html
• calendar

6 Answers 6

The easiest way is jQuery's Date Picker. One line of code....done.

<script type="text/javascript">
$( "#datepicker" ).datepicker();
</script>

Check out the jQueryUI datepicker: http://jqueryui./demos/datepicker/

Try the jquery ui datepicker

http://jqueryui./demos/datepicker/

Something a bit like this?

http://jqueryui./demos/datepicker/

Have a look at jQuery UI's calendar with an icon-trigger.

To have an icon trigger the calender, it would be something like this:

<script type="text/javascript">
    $(function() {
        $( "#idOfYourInput" ).datepicker({
            showOn: "button",
            buttonImage: "images/calendar.gif",
            buttonImageOnly: true
        });
    });
</script>

Have a look here:

http://www.tripwiremagazine./2011/10/jquery-calendar-date-pickers.html

Number 10 looks like what you need: http://codecanyon/item/jquery-date-range-picker/full_screen_preview/261519?ref=themespotters&ref=themespotters&clickthrough_id=42454046&redirect_back=true