Skip to main content
W
wam4
Inspiring
July 27, 2009
Question

cfcalendar onChange

  • July 27, 2009
  • 5 replies
  • 3718 views

I would like to use the cfcalendar tag to allow users to select the date without adding a submit button in the form. So I'm attempting the onChange event. The calendar displays correctly on the page but when I select a date I get an error "undefined is an invalid date or time string" . The returned URL is this mysite/POWR.cfm?selectdate=undefined

Here's the code:

<cfparam name="selectdate" default="#dateformat(now(), 'mm/dd/yyyy')#">

<cfform action="POWR.cfm" name="calendar" method="POST">
   <cfcalendar name="POWR" format="Flash" 
   height="200" width="200"
   firstdayofWeek="0"
   selectedDate="#selectdate#"
  onChange="getURL('POWR.cfm?selectdate='+calendar.selectedDate)">

</cfform>

Thanks for the help

    This topic has been closed for replies.

    5 replies

    A
    Anonymous
    July 30, 2009

    Could you not just use onChange="document.forms[0].submit()" (or use the form name instead of its index) to send the info across?  You could even post the data and not have to worry about the format of the data as much.

    BKBK
    BKBK
    Braniac
    July 30, 2009
    Could you not just use onChange="document.forms[0].submit()" (or use the form name instead of its index) to send the info across?  You could even post the data and not have to worry about the format of the data as much.

    That ain't the problem. The postman does in fact ring, but the envelope has no address.

    BKBK
    BKBK
    Braniac
    July 28, 2009

    @ Catchme dileep

    Wam4  already had a name attribute,  which is, POWR.

    @Wam4

    1) The format attribute is for the form, not for the calendar;

    2) calendar.selectedDate refers to the form, not to the calendar. Here, you should use Catchme's suggestion instead, namely POWR.selectedDate.

    3) You should format the date coming in as URL variable.

    The result is something like

    <cfif isDefined("url.selectdate")>
        <cfset selectDate = dateformat(url.selectdate, 'mm/dd/yyyy')>
    <cfelse>
        <cfset selectDate = dateformat(now(), 'mm/dd/yyyy')>
    </cfif>
    <cfform action="powrPage.cfm" name="calendarForm" method="POST" format="Flash">
       <cfcalendar name="POWR" 
       height="200" width="200"
       firstdayofWeek="0"
       selectedDate="#selectDate#"
      onChange="getURL('powrPage.cfm?selectdate='+POWR.selectedDate)">
    </cfform>

    W
    wam4Author
    Inspiring
    July 28, 2009

    I came up with a clunky way of doing it - it works but it's not pretty.

    <cfif IsDefined("url.thedate")>
       <cfset year =#right(url.thedate,2)#><br>
      <cfset newdate= #DateFormat(url.thedate, "mm/dd/yy")#>
      <cfset newdate = #left(newdate,5)#>
      <cfset newdate = "#newdate#/#year#">
      #newdate#

    </cfif>

    the date now formats as 07/31/09 after the onChange event is selected and returned to the page.   Hope this helps others.

    Thanks for your help catchme_dileep.  That one step pointed me in the right direction.

    W
    wam4Author
    Inspiring
    July 28, 2009

    I changed the onChange event so now it doesn't override my varialble in the calendar by changing the name of the URL variable from selectedDate to "thedate".  This clears one error.  So my code now looks like this:

    <cfparam name="selectdate" default="#dateformat(now(), 'mm/dd/yyyy')#">

    <cfform action="POWR.cfm" name="thecalendar" method="POST">
       <cfcalendar name="POWR" format="Flash"
       
       height="200" width="200"
       firstdayofWeek="0"
       selectedDate="#selectdate#"
       onChange="getURL('POWR.cfm?thedate='+POWR.selectedDate)">

    </cfform>

    But my url of the returned onChange event still looks like this  POWR.cfm?thedate=Thu%20Jul%2030%2000:00:00%20GMT-0400%202009.

    This is going to be a lot to strip out in order to get a functioning date, stripping out the middle and then the end year.  Is there a better way to be able to send the calendar date so it doesn't look like the above?

    Thanks

    Dileep_NR
    Dileep_NR
    Inspiring
    July 28, 2009

    try this

    <cfparam name="selectdate" default="#dateformat(now(), 'mm/dd/yyyy')#">

    <cfform action="POWR.cfm" name="calendar" method="POST">
       <cfcalendar name="POWR" format="Flash" 
       height="200" width="200"
       firstdayofWeek="0"

         name="cldnrDate"
       selectedDate="#selectdate#"
      onChange="getURL('POWR.cfm?selectdate='+cldnrDate.selectedDate);">

    </cfform>

    W
    wam4Author
    Inspiring
    July 28, 2009

    That is definitly on the right track. I didn't use the name"POWR" field in the onChange event.  The above example has two name fields so one needed to be removed. And I needed to add that to the onchange event.  Now when I select the date field it does return me to the page with a type of date but the date is still in an unrecognizable format. It sends it as "POWR.cfm?selectdate=Thu%20Jul%2030%2000:00:00%20GMT-0400%202009"  and the error message is "Thu Jul 30 00:00:00 GMT-0400 2009 is an invalid date or time string"  and oddly enough the error is in the line "selectedDate = "#selectdate#".  So is the URL variable over riding the cfparam default?

    And How do I convert it either before the user sends it or after the page receives it.  Trying to modify the onChange event to

    "onChange="getURL('POWR.cfm?selectdate='+#Dateformat(POWR.selectedDate,"mm/dd/yy")#)"

    gives the error "Element SelectedDated is undefined in POWR."

    Thanks for your help

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices