Exit
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
  • 한국 커뮤니티
0

cfcalendar onChange

Participant ,
Jul 27, 2009 Jul 27, 2009

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

3.7K
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Contributor ,
Jul 27, 2009 Jul 27, 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>

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jul 28, 2009 Jul 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

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jul 28, 2009 Jul 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

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jul 28, 2009 Jul 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.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jul 28, 2009 Jul 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>

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guest
Jul 30, 2009 Jul 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.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jul 30, 2009 Jul 30, 2009
LATEST
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.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Resources