Solved

How to append the selected date to a hidden input using jquery ui datepicker?

Posted on 2014-10-22
4
431 Views
Last Modified: 2014-10-23
Experts,

When using the jquery ui datepicker, I'd like to append the date the user selects to a hidden input field so that I can pass the value upon form submission.  Any assistance you could provide would be much appreciated.

Here's my fiddle which shows my current working code:

http://jsfiddle.net/bdbarrera/tf1vrf0v/

Just not sure how to modify the javascript to grab the date once it is selected?

Cheers!
0
Comment
Question by:evibesmusic
4 Comments
 
LVL 35

Assisted Solution

by:Robert Schutt
Robert Schutt earned 300 total points
ID: 40398790
use onSelect to add a callback function:
            //CREATE CALENDAR OBJECT
            $("#calendar").datepicker({autoSize:true, onSelect:function(selectedDate, objDatePicker){
                $('#stoppage_date').val($('#stoppage_date').val() + ',' + selectedDate);
            }});

Open in new window

updated fiddle: http://jsfiddle.net/robert_schutt/tf1vrf0v/6/
(note that I used a TEMP visible input to more easily check that it works)
0
 
LVL 82

Accepted Solution

by:
leakim971 earned 200 total points
ID: 40399133
also hide your calendar container with CSS else we need to click twice on the button the first time :
http://jsfiddle.net/tf1vrf0v/7/
0
 
LVL 11

Expert Comment

by:Murfur
ID: 40399146
Daft question for you: why have a hidden field and not just capture the date selected from the date field on form submission?
0
 

Author Closing Comment

by:evibesmusic
ID: 40399646
@All:

Thank you very much for the assistance. Much appreciated.
0

Featured Post

Threat Intelligence Starter Resources

Integrating threat intelligence can be challenging, and not all companies are ready. These resources can help you build awareness and prepare for defense.

Join & Write a Comment

There are a couple ways to attach a JavaScript function to dynamically created elements. You can make a new script for each element as it’s created or you can use delegation. Delegation allows a single script that is added at page creation to mat…
Introduction Knockoutjs (Knockout) is a JavaScript framework (Model View ViewModel or MVVM framework).   The main ideology behind Knockout is to control from JavaScript how a page looks whilst creating an engaging user experience in the least …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

759 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now