By: Marlene in JSP Tutorials on 2023-05-11 </p> <p class="para">To show a calendar in a text field when the user enters it in JSP, you can use JavaScript and jQuery. Here's an example:</p> <li>Add the jQuery and jQuery UI libraries to your JSP page. You can either download the libraries and include them in your project, or use a CDN link. <pre><script src="https://code.jquery.com/jquery-3.6.0.min.js"></script><br/><script src="https://code.jquery.com/ui/1.13.0/jquery-ui.min.js"></script></pre> <li>Create an input text field in your JSP page and add a CSS class to it. For example: <pre><input type="text" class="datepicker"></pre> <li>Initialize the datepicker widget using jQuery. Add the following code to your JSP page: <pre><script><br/> $(function() {<br/> $(".datepicker").datepicker();<br/> });<br/></script></pre> <p class="para"><span>Now, when the user clicks on the input text field with the "datepicker" class, a calendar will appear to choose a date.</span></p> <br/> <div class="previous-link">Previous<br/> <a href="showtutorial.php?tutorialid=675"><< Sending Email using JSP</a></div> </div> <br/> <br/> <link rel="stylesheet" type="text/css" href="//www.java-samples.com/comments/frontend/view/default/stylesheet/css/stylesheet.min.css?1681907948"/><div class="cmtx_form_section"><div id="cmtx_form_container" class="cmtx_form_container cmtx_clear"><h3 class="cmtx_form_heading">Add Comment</h3><div id="cmtx_preview"/><form id="cmtx_form" class="cmtx_form"><noscript><div class="cmtx_javascript_disabled">JavaScript must be enabled for certain features to work</div></noscript><div class="cmtx_required_text">* Required information</div><div class="cmtx_rows"><div class="cmtx_comment_group"><div class="cmtx_row cmtx_icons_row cmtx_clear cmtx_wait_for_comment" role="toolbar"><div class="cmtx_col_12"><div class="cmtx_container cmtx_icons_container cmtx_clear"><div class="cmtx_bb_code_container"><span class="cmtx_bb_code cmtx_bb_code_bold" data-cmtx-tag="[B]|[/B]" title="Bold"/><span class="cmtx_bb_code cmtx_bb_code_italic" data-cmtx-tag="[I]|[/I]" title="Italic"/><span class="cmtx_bb_code cmtx_bb_code_underline" data-cmtx-tag="[U]|[/U]" title="Underline"/><span class="cmtx_bb_code cmtx_bb_code_strike" data-cmtx-tag="[STRIKE]|[/STRIKE]" title="Strike"/><span class="cmtx_bb_code cmtx_bb_code_superscript" data-cmtx-tag="[SUPERSCRIPT]|[/SUPERSCRIPT]" title="Superscript"/><span class="cmtx_bb_code cmtx_bb_code_subscript" data-cmtx-tag="[SUBSCRIPT]|[/SUBSCRIPT]" title="Subscript"/><span class="cmtx_bb_code cmtx_bb_code_code" data-cmtx-tag="[CODE]|[/CODE]" title="Code"/><span class="cmtx_bb_code cmtx_bb_code_php" data-cmtx-tag="[PHP]|[/PHP]" title="PHP Code"/><span class="cmtx_bb_code cmtx_bb_code_quote" data-cmtx-tag="[QUOTE]|[/QUOTE]" title="Quote"/><span class="cmtx_bb_code cmtx_bb_code_line" data-cmtx-tag="[LINE]" title="Line"/><span class="cmtx_bb_code cmtx_bb_code_bullet" data-cmtx-tag="[BULLET]|[ITEM]|[/ITEM]|[/BULLET]" title="Bullet list" data-cmtx-target-modal="#cmtx_bullet_modal"/><span class="cmtx_bb_code cmtx_bb_code_numeric" data-cmtx-tag="[NUMERIC]|[ITEM]|[/ITEM]|[/NUMERIC]" title="Numeric list" data-cmtx-target-modal="#cmtx_numeric_modal"/><span class="cmtx_bb_code cmtx_bb_code_link" data-cmtx-tag="[LINK]|[LINK=|]|[/LINK]" title="Web link" data-cmtx-target-modal="#cmtx_link_modal"/><span class="cmtx_bb_code cmtx_bb_code_email" data-cmtx-tag="[EMAIL]|[EMAIL=|]|[/EMAIL]" title="Email link" data-cmtx-target-modal="#cmtx_email_modal"/><span class="cmtx_bb_code cmtx_bb_code_image" data-cmtx-tag="[IMAGE]|[/IMAGE]" title="Image" data-cmtx-target-modal="#cmtx_image_modal"/><span class="cmtx_bb_code cmtx_bb_code_youtube" data-cmtx-tag="[YOUTUBE]|[/YOUTUBE]" title="YouTube" data-cmtx-target-modal="#cmtx_youtube_modal"/></div><div class="cmtx_icons_separator"/><div class="cmtx_smilies_container"><span class="cmtx_smiley cmtx_smiley_smile" data-cmtx-tag=":smile:" title="Smile"/><span class="cmtx_smiley cmtx_smiley_sad" data-cmtx-tag=":sad:" title="Sad"/><span class="cmtx_smiley cmtx_smiley_huh" data-cmtx-tag=":huh:" title="Huh"/><span class="cmtx_smiley cmtx_smiley_laugh" data-cmtx-tag=":laugh:" title="Laugh"/><span class="cmtx_smiley cmtx_smiley_mad" data-cmtx-tag=":mad:" title="Mad"/><span class="cmtx_smiley cmtx_smiley_tongue" data-cmtx-tag=":tongue:" title="Tongue"/><span class="cmtx_smiley cmtx_smiley_cry" data-cmtx-tag=":cry:" title="Cry"/><span class="cmtx_smiley cmtx_smiley_grin" data-cmtx-tag=":grin:" title="Grin"/><span class="cmtx_smiley cmtx_smiley_wink" data-cmtx-tag=":wink:" title="Wink"/><span class="cmtx_smiley cmtx_smiley_scared" data-cmtx-tag=":scared:" title="Scared"/><span class="cmtx_smiley cmtx_smiley_cool" data-cmtx-tag=":cool:" title="Cool"/><span class="cmtx_smiley cmtx_smiley_sleep" data-cmtx-tag=":sleep:" title="Sleep"/><span class="cmtx_smiley cmtx_smiley_blush" data-cmtx-tag=":blush:" title="Blush"/><span class="cmtx_smiley cmtx_smiley_confused" data-cmtx-tag=":confused:" title="Confused"/><span class="cmtx_smiley cmtx_smiley_shocked" data-cmtx-tag=":shocked:" title="Shocked"/></div></div></div></div><div class="cmtx_row cmtx_comment_row cmtx_clear"><div class="cmtx_col_12"><div class="cmtx_container cmtx_comment_container"><textarea name="cmtx_comment" id="cmtx_comment" class="cmtx_field cmtx_textarea_field cmtx_comment_field cmtx_required" placeholder="Enter your comment here .." title="Enter your comment here" maxlength="1000"/></div></div></div><div class="cmtx_row cmtx_counter_row cmtx_clear cmtx_wait_for_comment"><div class="cmtx_col_12"><div class="cmtx_container cmtx_counter_container"><span id="cmtx_counter" class="cmtx_counter">1000</span></div></div></div></div><div class="cmtx_row cmtx_rating_row cmtx_clear cmtx_wait_for_comment"><div class="cmtx_col_12"><div class="cmtx_container cmtx_rating_container"><div id="cmtx_rating" class="cmtx_rating "><div class="cmtx_rating_block"><input type="radio" id="cmtx_star_5" name="cmtx_rating" value="5"/><label for="cmtx_star_5" title="5 - Excellent"/><input type="radio" id="cmtx_star_4" name="cmtx_rating" value="4"/><label for="cmtx_star_4" title="4 - Good"/><input type="radio" id="cmtx_star_3" name="cmtx_rating" value="3"/><label for="cmtx_star_3" title="3 - Fair"/><input type="radio" id="cmtx_star_2" name="cmtx_rating" value="2"/><label for="cmtx_star_2" title="2 - Poor"/><input type="radio" id="cmtx_star_1" name="cmtx_rating" value="1"/><label for="cmtx_star_1" title="1 - Dreadful"/></div></div></div></div></div> <div class="cmtx_row cmtx_user_row cmtx_clear "><div class="cmtx_col_12 "><div class="cmtx_container cmtx_name_container"><input type="text" name="cmtx_name" id="cmtx_name" class="cmtx_field cmtx_text_field cmtx_name_field cmtx_required" value="" placeholder="Name" title="Enter your name here" maxlength="30"/></div></div></div><div class="cmtx_row cmtx_recaptcha_row cmtx_clear cmtx_wait_for_user"><div class="cmtx_col_12"><div class="cmtx_container cmtx_recaptcha_container"><div id="g-recaptcha" class="g-recaptcha" data-sitekey="6Lf_fZ4lAAAAACT5shN16QhdtlZXlnc2vLaoQttW" data-theme="light" data-size="normal"/></div></div></div><div class="cmtx_checkbox_container cmtx_wait_for_user"><div class="cmtx_row cmtx_cookie_row cmtx_clear"><div class="cmtx_col_12"><div class="cmtx_container cmtx_cookie_container"><input type="checkbox" id="cmtx_cookie" name="cmtx_cookie" value="1" checked="checked"/> <label for="cmtx_cookie">Remember my form inputs<span class="cmtx_checkbox_extra"> on this computer</span></label></div></div></div></div><div class="cmtx_row cmtx_button_row cmtx_clear"><div class="cmtx_col_2"><div class="cmtx_container cmtx_submit_button_container"><input type="button" id="cmtx_submit_button" class="cmtx_button cmtx_button_primary " data-cmtx-type="submit" value="Add Comment" title="Add Comment"/></div></div><div class="cmtx_col_2"><div class="cmtx_container cmtx_preview_button_container"><input type="button" id="cmtx_preview_button" class="cmtx_button cmtx_button_secondary " data-cmtx-type="preview" value="Preview" title="Preview"/></div></div><div class="cmtx_col_8"/></div><div class="cmtx_row cmtx_powered_by_row cmtx_clear"><div class="cmtx_col_12"><div class="cmtx_container cmtx_powered_by_container"><div class="cmtx_powered_by"/></div></div></div></div><input type="hidden" name="cmtx_reply_to" value=""/><input type="hidden" id="cmtx_hidden_data" value="&cmtx_login=0"/><input type="hidden" name="cmtx_iframe" value="0"/><input type="hidden" name="cmtx_subscribe" value=""/><input type="hidden" name="cmtx_time" value="1702233833"/><input type="text" name="cmtx_honeypot" class="cmtx_honeypot" value="" autocomplete="off"/></form><div id="cmtx_bullet_modal" class="cmtx_modal_box" role="dialog"><header><a href="#" class="cmtx_modal_close">x</a><div>Insert Bullet List</div></header><div class="cmtx_modal_body"><div>Please enter at least one item.</div><div><span>Item:</span> <input type="text"/></div><div><span>Item:</span> <input type="text"/></div><div><span>Item:</span> <input type="text"/></div><div><span>Item:</span> <input type="text"/></div><div><span>Item:</span> <input type="text"/></div></div><footer><input type="button" id="cmtx_bullet_modal_insert" class="cmtx_button cmtx_button_primary" value="Insert"/><input type="button" class="cmtx_button cmtx_button_secondary" value="Cancel"/></footer></div><div id="cmtx_numeric_modal" class="cmtx_modal_box" role="dialog"><header><a href="#" class="cmtx_modal_close">x</a><div>Insert Numeric List</div></header><div class="cmtx_modal_body"><div>Please enter at least one item.</div><div><span>Item:</span> <input type="text"/></div><div><span>Item:</span> <input type="text"/></div><div><span>Item:</span> <input type="text"/></div><div><span>Item:</span> <input type="text"/></div><div><span>Item:</span> <input type="text"/></div></div><footer><input type="button" id="cmtx_numeric_modal_insert" class="cmtx_button cmtx_button_primary" value="Insert"/><input type="button" class="cmtx_button cmtx_button_secondary" value="Cancel"/></footer></div><div id="cmtx_link_modal" class="cmtx_modal_box" role="dialog"><header><a href="#" class="cmtx_modal_close">x</a><div>Insert Link</div></header><div class="cmtx_modal_body"><div>Please enter the link of the website</div><div><input type="url" placeholder="http://"/></div><div>Optionally you can add display text</div><div><input type="text"/></div></div><footer><input type="button" id="cmtx_link_modal_insert" class="cmtx_button cmtx_button_primary" value="Insert"/><input type="button" class="cmtx_button cmtx_button_secondary" value="Cancel"/></footer></div><div id="cmtx_email_modal" class="cmtx_modal_box" role="dialog"><header><a href="#" class="cmtx_modal_close">x</a><div>Insert Email</div></header><div class="cmtx_modal_body"><div>Please enter the email address</div><div><input type="email"/></div><div>Optionally add any display text</div><div><input type="text"/></div></div><footer><input type="button" id="cmtx_email_modal_insert" class="cmtx_button cmtx_button_primary" value="Insert"/><input type="button" class="cmtx_button cmtx_button_secondary" value="Cancel"/></footer></div><div id="cmtx_image_modal" class="cmtx_modal_box" role="dialog"><header><a href="#" class="cmtx_modal_close">x</a><div>Insert Image</div></header><div class="cmtx_modal_body"><div>Please enter the link of the image</div><div><input type="url" placeholder="http://"/></div></div><footer><input type="button" id="cmtx_image_modal_insert" class="cmtx_button cmtx_button_primary" value="Insert"/><input type="button" class="cmtx_button cmtx_button_secondary" value="Cancel"/></footer></div><div id="cmtx_youtube_modal" class="cmtx_modal_box" role="dialog"><header><a href="#" class="cmtx_modal_close">x</a><div>Insert YouTube Video</div></header><div class="cmtx_modal_body"><div>Please enter the link of the video</div><div><input type="url" placeholder="http://"/></div></div><footer><input type="button" id="cmtx_youtube_modal_insert" class="cmtx_button cmtx_button_primary" value="Insert"/><input type="button" class="cmtx_button cmtx_button_secondary" value="Cancel"/></footer></div><div id="cmtx_privacy_modal" class="cmtx_modal_box" role="dialog"><header><a href="#" class="cmtx_modal_close">x</a><div>Privacy Policy</div></header><div class="cmtx_modal_body"><p>This policy contains information about your privacy. By posting, you are declaring that you understand this policy:</p><ul><li>Your name, rating, website address, town, country, state and comment will be publicly displayed if entered.</li><li>Aside from the data entered into these form fields, other stored data about your comment will include:<ul><li>Your IP address (not displayed)</li><li>The time/date of your submission (displayed)</li></ul></li><li>Your email address will not be shared. It is collected for only two reasons:<ul><li>Administrative purposes, should a need to contact you arise.</li><li>To inform you of new comments, should you subscribe to receive notifications.</li></ul></li><li>A cookie may be set on your computer. This is used to remember your inputs. It will expire by itself.</li></ul><p>This policy is subject to change at any time and without notice.</p></div><footer><input type="button" class="cmtx_button cmtx_button_secondary" value="Close"/></footer></div><div id="cmtx_terms_modal" class="cmtx_modal_box" role="dialog"><header><a href="#" class="cmtx_modal_close">x</a><div>Terms and Conditions</div></header><div class="cmtx_modal_body"><p>These terms and conditions contain rules about posting comments. By submitting a comment, you are declaring that you agree with these rules:</p><ul><li>Although the administrator will attempt to moderate comments, it is impossible for every comment to have been moderated at any given time.</li><li>You acknowledge that all comments express the views and opinions of the original author and not those of the administrator.</li><li>You agree not to post any material which is knowingly false, obscene, hateful, threatening, harassing or invasive of a person's privacy.</li><li>The administrator has the right to edit, move or remove any comment for any reason and without notice.</li></ul><p>Failure to comply with these rules may result in being banned from submitting further comments.</p><p>These terms and conditions are subject to change at any time and without notice.</p></div><footer><input type="button" class="cmtx_button cmtx_button_secondary" value="Close"/></footer></div><div id="cmtx_js_settings_form" class="cmtx_hide" hidden="">{"commentics_url":"\/\/www.java-samples.com\/comments\/","page_id":13164,"enabled_country":false,"country_id":0,"enabled_state":false,"state_id":0,"enabled_upload":false,"maximum_upload_amount":3,"maximum_upload_size":5,"maximum_upload_total":5,"captcha":false,"captcha_url":"https:\/\/java-samples.com\/comments\/frontend\/index.php?route=main\/form\/captcha&page_id=13164","cmtx_wait_for_comment":"cmtx_wait_for_comment","lang_error_file_num":"A maximum of %d files are allowed to be uploaded","lang_error_file_size":"Please upload files no bigger than %.1f MB in size","lang_error_file_total":"The total size of all files must be less than %.1f MB","lang_error_file_type":"Only image file types are allowed to be uploaded","lang_text_loading":"Loading ..","lang_placeholder_country":"Country","lang_placeholder_state":"State","lang_text_country_first":"Please select a country first","lang_button_submit":"Add Comment","lang_button_preview":"Preview","lang_button_remove":"Remove","lang_button_processing":"Please Wait.."}</div></div></div><div class="cmtx_divider_section"/><div class="cmtx_comments_section"><div id="cmtx_comments_container" class="cmtx_comments_container cmtx_clear"><h3 class="cmtx_comments_heading">Comments</h3><div class="cmtx_no_comments">No comments yet. Be the first!</div></div></div><div id="cmtx_lightbox_modal" class="cmtx_lightbox_modal cmtx_modal_box" role="dialog"><header><a href="#" class="cmtx_modal_close">x</a></header><div class="cmtx_modal_body"/><footer><input type="button" class="cmtx_button cmtx_button_secondary" value="Close"/></footer></div><div id="cmtx_js_settings_page" class="cmtx_hide" hidden="">{"commentics_url":"\/\/www.java-samples.com\/comments\/","auto_detect":false}</div></div> </div> <p class="para"> <b>Most Viewed Articles</b> (in JSP ) </p><div><p class="para"><b><a href="showtutorial.php?tutorialid=1917">Show a calendar for user input in JSP</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=14">Click to Activate and Use this control</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=1248">Scriptlets and Expressions in JSP</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=1252">The Out Object in JSP</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=1009">What are the different scopes in JSP?</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=612">The TryCatchFinally Interface in JSP</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=1002">Getting Started with JSP</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=1001">What is JSP?</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=948">Embedding MP3 audio file in a JSP</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=947">Embedding a QuickTime movie in a JSP</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=946">Automatically Refreshing a JSP</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=945">Getting HTTP Request Headers in a JSP</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=944">Using a DataSource from WebLogic in a JSP</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=617">Steps to get a Free SSL certificate for your Tomcat</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=619">JSP Example to connect to MS SQL database and retrieve records</a></b></p></div> <b>Latest Articles</b> (in JSP) </p><div><p class="para"><b><a href="showtutorial.php?tutorialid=1917">Show a calendar for user input in JSP</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=675">Sending Email using JSP</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=617">Steps to get a Free SSL certificate for your Tomcat</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=618">Encrypting Passwords in Tomcat using Servlets</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=1824">Future of JSP</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=614">JSP Tags for SQL to connect to a database</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=1500">LifecycleException: service.getName(): "Catalina"; Protocol handler start failed: `java.net.BindException: Permission denied <null>:80</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=1294">JSP Alert Example</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=1295">JSP CheckBox Example</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=1292">Uploading a file to a server using JSP</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=1291">Uploading an Image to a Database using JSP</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=1288">A JSP page that gets properties from a bean</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=1248">Scriptlets and Expressions in JSP</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=1247">Declarations in JSP</a></b></p><p class="para"><b><a href="showtutorial.php?tutorialid=1246">The taglib, tag, include, attribute and the variable Directive in JSP</a></b></p></div> <h4>Related Tutorials</h4> <div><p class="para"><a href="https://www.java-samples.com/showtutorial.php?tutorialid=1917">Show a calendar for user input in JSP</a></p><p class="para"><a href="https://www.java-samples.com/showtutorial.php?tutorialid=675">Sending Email using JSP</a></p><p class="para"><a href="https://www.java-samples.com/showtutorial.php?tutorialid=618">Encrypting Passwords in Tomcat using Servlets</a></p><p class="para"><a href="https://www.java-samples.com/showtutorial.php?tutorialid=617">Steps to get a Free SSL certificate for your Tomcat</a></p><p class="para"><a href="https://www.java-samples.com/showtutorial.php?tutorialid=1824">Future of JSP</a></p><p class="para"><a href="https://www.java-samples.com/showtutorial.php?tutorialid=614">JSP Tags for SQL to connect to a database</a></p><p class="para"><a href="https://www.java-samples.com/showtutorial.php?tutorialid=1500">LifecycleException: service.getName(): "Catalina"; Protocol handler start failed: `java.net.BindException: Permission denied <null>:80</a></p><p class="para"><a href="https://www.java-samples.com/showtutorial.php?tutorialid=1295">JSP CheckBox Example</a></p><p class="para"><a href="https://www.java-samples.com/showtutorial.php?tutorialid=1294">JSP Alert Example</a></p><p class="para"><a href="https://www.java-samples.com/showtutorial.php?tutorialid=1291">Uploading an Image to a Database using JSP</a></p><p class="para"><a href="https://www.java-samples.com/showtutorial.php?tutorialid=1292">Uploading a file to a server using JSP</a></p><p class="para"><a href="https://www.java-samples.com/showtutorial.php?tutorialid=1288">A JSP page that gets properties from a bean</a></p><p class="para"><a href="https://www.java-samples.com/showtutorial.php?tutorialid=1247">Declarations in JSP</a></p><p class="para"><a href="https://www.java-samples.com/showtutorial.php?tutorialid=1249">Tag Libraries in JSP</a></p><p class="para"><a href="https://www.java-samples.com/showtutorial.php?tutorialid=1248">Scriptlets and Expressions in JSP</a></p></div>