Results 1 to 6 of 6

Thread: Jason's Date Input Calendar

  1. #1
    Join Date
    Aug 2013
    Posts
    2
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Exclamation Jason's Date Input Calendar

    Hello,
    with Jason's Date Input Calendar, http://www.dynamicdrive.com/dynamici...oncalendar.htm, how can I retrieve the value of the selected date in a variable?
    Thank you.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Get a reference to the hidden field that contains the date and get its value. There are many ways to do that. They all would use the name that you created the calendar with. So, say you made a calendar like so:

    Code:
    <script>DateInput('orderdate', true, 'DD-MON-YYYY')</script>
    The most direct method, assuming there are no other elements or calendars on the page with the 'orderdate' name, would be:

    Code:
    var myvar = document.getElementsByName('orderdate')[0].value;
    Generally you will not need this though because, if the 'orderdate' calendar is in a form, and if that form is submitted, then the POST or GET value of ['orderdate'] will be the currently selected date.

    But, of course if you do need it in javascript you need to do that each time you want it, as it might have changed. You could set an interval.

    But, if I do (in Chrome's developer tools):

    Code:
    console.log(orderdate_Object.picked)
    I get this information:

    Code:
    storedMonthObject {
    	date: Fri Aug 02 2013 00:00:00 GMT-0400 (Eastern Daylight Time)
    	day: 2
    	dayCount: 31
    	dayPad: "02"
    	firstDay: 4
    	formatted: "02-AUG-2013"
    	fullName: "August 2013"
    	monthIndex: 7
    	monthName: "August"
    	monthPad: "08"
    	monthShort: "AUG"
    	yearPad: "2013"
    	yearValue: 2013
    }
    So, in real time you could skip the myvar part, and wherever you wanted this value you could represent it as:

    Code:
    orderdate_Object.picked.formatted
    or:

    Code:
    orderdate_Object.picked.day + ' ' + orderdate_Object.picked.fullname
    or whatever exactly you want to retrieve from the picked object.

    Why do you want this, what are you planning on doing with it?
    Last edited by jscheuer1; 08-02-2013 at 02:42 PM. Reason: fix typo in code add orderdate_Object method
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. The Following User Says Thank You to jscheuer1 For This Useful Post:

    siecool (08-02-2013)

  4. #3
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    3,033
    Thanks
    25
    Thanked 599 Times in 575 Posts
    Blog Entries
    40

    Default

    Pretty much like any other form, I would say - you would post the form and retrieve the value from the named field.

    From the DD demo page;
    Code:
    <script>DateInput(DateName, Required*, DateFormat*, DefaultDate*)</script>
    DateName: STRING - required. Name of the hidden form element to store the selected, formatted date You do NOT need to create this field manually in your form.
    So this is the name you retrieve when the form is posted;
    PHP Code:
    $datename $_POST['DateName']; // change to whatever name you've used in the JavaScript ('DateName' is just used in the demo)
    echo $datename;
    // would output something like " 02-Aug-2013 " if the DateFormat parameter is set as " DD-MON-YYYY " 
    If you need more help, please post a link to your page. Your form processing script may also be required.

    EDIT: John and I are posting at the same time (I am obviously much slower on the keyboard) but I think our posts collectively provide a nicely rounded explanation and other available options.
    Last edited by Beverleyh; 08-02-2013 at 01:53 PM. Reason: Hello John!
    Focus on Function Web Design
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps

  5. The Following User Says Thank You to Beverleyh For This Useful Post:

    siecool (08-02-2013)

  6. #4
    Join Date
    Aug 2013
    Posts
    2
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Exclamation two different calendars on the same page

    Thank you. But How to put two different calendars on the same page?

  7. #5
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    3,033
    Thanks
    25
    Thanked 599 Times in 575 Posts
    Blog Entries
    40

    Default

    Just use a different DateName in each JavaScript call.
    Focus on Function Web Design
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps

  8. The Following User Says Thank You to Beverleyh For This Useful Post:

    siecool (08-02-2013)

  9. #6
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,891
    Thanks
    2
    Thanked 441 Times in 435 Posts

    Default

    create a new global variable

    Code:
    var orderdateV='not set'
    where orderdate if parameter 0 of the call DateInput('orderdate', true, 'DD-MON-YYYY') + 'V'

    the html

    Code:
    <form>
    <input type="button" name="" value="Test" onmouseup="alert(orderdateV);" />
    <script>DateInput('orderdate', true, 'DD-MON-YYYY')</script>
    
    <input type="button" onClick="alert(this.form.orderdate.value)" value="Show date value passed">
    
    </form>
    add the line in red

    Code:
    // Sets the form elements after a day has been picked from the calendar
    function PickDisplayDay(ClickedDay) {
       this.show();
       var MonthList = this.getMonthList();
       var DayList = this.getDayList();
       var YearField = this.getYearField();
       FixDayList(DayList, GetDayCount(this.displayed.yearValue, this.displayed.monthIndex));
       // Select the month and day in the lists
       for (var i=0;i<MonthList.length;i++) {
          if (MonthList.options[i].value == this.displayed.monthIndex){
           MonthList.options[i].selected = true;
          }
       }
       for (var j=1;j<=DayList.length;j++) {
          if (j == ClickedDay) DayList.options[j-1].selected = true;
       }
       this.setPicked(this.displayed.yearValue, this.displayed.monthIndex, ClickedDay);
       // Change the year, if necessary
       YearField.value = this.picked.yearPad;
       YearField.defaultValue = YearField.value;
       window[this.hiddenFieldName+'V']=[MonthList.value,ClickedDay,this.picked.yearPad];
    }
    Vic
    God Loves You and will never love you less.
    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

Similar Threads

  1. Jason's Date Input Calendar - Need Help to Display Empty Date Fields?
    By Dorgs in forum Dynamic Drive scripts help
    Replies: 9
    Last Post: 06-07-2013, 02:08 PM
  2. passing & recieving a date with mysql using Jason's Date Input Calendar
    By kkslider in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 02-19-2012, 04:30 PM
  3. Jason's Date Input Calendar - Calendar reappearing in IE8
    By NGJ in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 03-30-2011, 01:30 PM
  4. Jason's Date Input Calendar onClick to change the showing date
    By williamstam in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 03-13-2008, 12:48 PM
  5. Replies: 1
    Last Post: 11-04-2005, 05:08 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •