Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how to show a jquery datepicker on button click

I want to show a datepicker only on button click

<input type="button" id=day value="day" />
$("#day").datepicker();

the above line fills the button text with the selected date

I have also tried with below code but nothing happens

$("#day").click(function() {
    $("#hiddenField").datepicker('show');
});
like image 873
JN_newbie Avatar asked Nov 27 '13 10:11

JN_newbie


People also ask

What is Datepicker in jQuery?

A date-picker of jQuery UI is used to provide a calendar to the user to select the date from a Calendar. This date picker usually connected to a text-box so user selection of date from the calendar can be transferred to the textbox.

What is Datepicker in JavaScript?

The JavaScript DatePicker (Calendar Picker) is a lightweight and mobile-friendly control that allows end users to enter or select a date value. It has month, year, and decade view options to quickly navigate to the desired date.


1 Answers

You can do this with the built-in showOn function:

$( "#hiddenField" ).datepicker({
    showOn: "button",
    buttonText: "day"
});

JSFiddle: http://jsfiddle.net/Uv8V4/

Reference: http://jqueryui.com/datepicker/#icon-trigger

like image 185
Praxis Ashelin Avatar answered Sep 21 '22 21:09

Praxis Ashelin