Date Field Mask Not Working [duplicate] - coldfusion

This question already has an answer here:
JavaScript Date Format for ColdFusion Date Field
(1 answer)
Closed 8 years ago.
This is very frustrating. I am using cfinput datefield and mask="MM/DD/YYYY" and its not working. If it is cfinput text and mask="MM/DD/YYYY" it works perfect. I do not want to only have a textbox though I would like to keep the calendar that the date field gives you... The issue is when they use the calendar it is in the correct format MM/DD/YYYY but if the user just types in the date into the textbox without using the calendar the user can type whatever they desire.. (122334435) which obviously is unacceptable. Any ideas or workarounds anyone may be aware of?
Works:
<cfform name="foo">
<cfinput
type="text"
name="test"
validate="eurodate"
mask="99/99/9999"
validateat="onblur" />
<input type="submit">
</cfform>
Does Not Work:
<cfform name="foo">
<cfinput
type="datefield"
name="test"
validate="eurodate"
mask="MM/DD/YYYY"
validateat="onblur" />
<input type="submit">
</cfform>

I have added an answer to the other question that was originally opened regarding this same issue. I will post a bit here as well since users may find this question and not the other one. Or you could delete this question.
I believe the problem is that the mask attribute on the <cfinput type="datefield" ... code only works when using Flash forms - documentation reference.
I have emphasized the text from that documentation below:
Masking cfcalendar and datefield input
In the cfcalendar tag and the Flash format datefield input control, you use the following masks to determine the format of the output. You can use uppercase or lowercase characters in the mask:
...
The following pattern specifies that the Flash form sends the date selected using a datefield input control to ColdFusion as text in the format 04/29/2004:
<cfinput name="startDate" type="datefield" label="date:" mask="mm/dd/yyyy"/>
Since you are not using a Flash form the mask is not working for you. You could try switching to a regular <cfinput type="text" ... input and change your mask to something like "99/99/9999". That would give you the correct format but the user could still enter invalid dates so you would need additional code to catch that.
This is just another example of why using the built-in ColdFusion UI tags is not a good idea. They work for very simple examples but when you need more customization they fail you. You would be better off to use a JavaScript library (like jQuery) for client side validation. Adobe's own Ben Forta acknowledged this several years ago. And the ColdFusion-UI-the-Right-Way project was started because of this as well.
EDIT
On the other question that was posted Adam pointed out another reference in the ColdFusion documentation that reinforces my point. I have emphasized the text from that documentation below:
Masking input data
In HTML and Flash forms, the mask attribute controls the format of data that can be entered into a text field or that is selected in a datefield input control calendar. In HTML format, it does not prevent users from typing a date that does not follow the mask into a datefield input control. You can combine masking and validation on a field.

Related

Why is the FORM scope showing fewer values than were actually submitted by this AJAX file uploader?

I'm not sure I understand how to phrase my question, but I believe it's specific to ColdFusion's handling of certain AJAX form data, despite my reference to a specific JavaScript plugin.
I'm trying to implement the FilePond uploader on a ColdFusion 2011 server, and I've got it configured well on the frontend (it uploads the files to tmp folder just fine), but my problem is not knowing how to get ColdFusion to process the extra metadata it sends along with it on every upload. This data doesn't look to me like it comes in the same format as plain old hidden input fields.
When I inspect the network request with Dev Tools, it looks different to me than other forms I've processed. There are two "filepond" entries, one a JSON object and the other the binary image. When I < cfdump var="#form.FilePond#">, I only get the tmp uploaded file path, which I can process. But how do I access the JSON in my screenshot containing the "parentid"? Nothing I've tried, like form.FilePond[1], seems to work and throws errors.
Update with output from CF form processing page:
1st line is output of Form.FilePond.
2nd is cfdump of Form.
3rd is cfdump URL.
4th is cfdump of getHttpRequestData()
Update:
Bugs filed for CF2016 (core support ending for CF11 after April 2019)
CF-4204103 -
FORM scope is missing values when same named fields include type=file
CF-4204102 - sameFormFieldAsArray setting doesn't work with enctype="multipart/form-data"
After some testing, I've concluded it's a ColdFusion bug.
Issue:
The issue seems to occur under these conditions
Request is a multipart/form-data POST
Contains multiple fields with the same name
At least 1 of those fields is a file field i.e. type="file"
The first field submitted (within the group) is NOT a file field
Under those conditions, ColdFusion seems to ignore everything before the first file field. (If you check the filepond source ut confirms the metadata field is submitted before any file fields). That's why the metadata value doesn't appear when dumping the FORM scope.
Note, the this.sameFormFieldsAsArray setting has no effect because it doesn't work with multipart/form-data requests.
Test Case
Below is a test case. Notice the results are what you'd expect when the same named field occurs after the first file field?
<cfdump var="#form#" label="Form scope">
<form method="post" enctype="multipart/form-data">
<br>First:
<input type="file" name="fileFirst"><br>
<input type="text" name="fileFirst" value="Lions"><br>
<br>Last:
<input type="text" name="fileLast" value="Tigers"><br>
<input type="file" name="fileLast"><br>
<br>Middle:
<input type="text" name="fileMiddle" value="Bears"><br>
<input type="file" name="fileMiddle"><br>
<input type="text" name="fileMiddle" value="Oh My"><br>
<input type="submit">
</form>
Workaround
This blog provides a workaround using an undocumented feature of the FORM scope. Using form.getPartsArray() provides access to both "filePond" fields allowing you to extract the value of the dropped field. Not ideal, but does work until the issue is fixed.
Keep in mind this is an undocumented feature, so be sure to isolate the code for easier alterations in case Adobe alters or removes that function in the future (which they've done before, so fair warning!).
<cfscript>
// dump raw form fields
for (part in form.getPartsArray()) {
writeDump({ fieldName = part.getName()
, isFile = part.isFile()
, fieldValue = (part.isFile() ? part.getFileName() : part.getStringValue())
}
);
}
</cfscript>

Retrieve radio input value in a CDHtmlDialog based application

I'm working on a MFC application based on html dialogs.
I've encountered lot of struggle for exchanging datas between the html and the c++ code, but I finally managed to make it working.
I'm retrieving without any problems values from text inputs (DDX_DHtml_ElementText()), selects (DDX_DHtml_SelectValue()), checkboxes (DDX_DHtml_CheckBox()) but I can't find out how to get the value from a radio input ...
I don't understand how to use the DDX_DHtml_Radio() method.
void DDX_DHtml_Radio(
CDataExchange* pDX,
LPCTSTR szId,
long& value
);
I guess value will store 0, 1, 2 etc. according to the checked radio input,
but what do I have to store in the szId ? I imagine it needs the id of the html element that group all the radio buttons, but there is zero documentation or zero example about it ... I've tried with the input id but value is still null.
in html I just have :
<input id="radio-https" type="radio" name="http-switch" value="https"/>
<input id="radio-http" type="radio" name="http-switch" value="http" checked="checked"/>
Uh ... I tried with radio's name and it worked :
DDX_DHtml_Radio(pDX, _T("http-switch"), httpSwitchValue);
the only microsoft documentation is unclear ...
szId
The value that you specified for the HTML control's ID parameter.
I'd mark this as an answer as I saw many posts on the internet about it without any answer

HTML5 number input field step attribute broken in Internet Explorer 10 and Internet Explorer 11

It appears some of my website's users are experiencing issues when attempting to insert values into input fields of type number with the step attribute set.
I am using Django 1.6 to render the forms to HTML.
The number fields map to an underlying DecimalField model field with max_digits=25 and decimal_places=5
This results in the following example html being rendered for the number field:
<input type="number" value="" step="0.00001" name="quantity" id="id_quantity">
The step attribute I know is not yet supported in FireFox but is in Opera, Chrome, Safari and IE10+
Everything works fine in all browsers except IE10 and IE11. In the above example the maximum range that can be entered is -227 to 227 in IE10 and IE11. If I try to enter a lower or greater value (respectively) than this I get a 'You must enter a valid value' error and cannot submit the form.
According to http://www.w3schools.com/tags/att_input_step.asp
The step attribute specifies the legal number intervals for an element.
Example: if step="3", legal numbers could be -3, 0, 3, 6, etc.
So in my user's example they were attempting to enter 20000 as the value which failed in IE10 and IE11. If my calculations are correct 20000 falls correctly into an interval of 0.00001
A solution for me could be to remove the step attribute from all my forms that use a number field, either via the django forms or using javascript, but I think this would be a very messy solution and one that goes against the grain of HTML5.
Has anyone else encountered a similar problem, have I done something wrong or is this a bug in IE10 and IE11?
Any thoughts, comments or answers welcome. In the meantime I will be forced into providing my usual solution to affected users by suggesting they use a browser that works.
You're not alone, IE is pretty buggy on this.
I'm not sure about IE10, I can only test IE11 right now, and it kinda treats number fields as date fields, which it actually shouldn't support at all, still when passing for example 20000 it says "Insert a valid date" (originally "Geben Sie ein gültiges Datum ein").
And indeed, when entering something like 01.01.2000 or 01-01-2000 it passes validation, though even 20000.01.123456789 passes, just like 90000 or 0.foobar, so I guess the validation is just totally messed up.
So for the time being you'll probably have to use some kind of polyfill in case you want to please IE users.
IE10's HTML5 form validation is really buggy in this case, so you might want to consider disabling HTML5 form validation for this form.
You can do this by adding a novalidate attribute to the form tag. For example, you might want to do something like this:
<form method='POST' action='.' novalidate='novalidate'>
<input type="number" value="" step="0.00001" name="quantity" id="id_quantity">
</form>
Setting novalidate will tell the browser to not try to be useful, which should work out your issue. However, please be aware that this will disable the HTML5 validation for the whole form for all browsers. If you need to keep this for some browsers while removing it from IE, you'll have to add the novalidate attribute via Javascript on page load after checking the browser user agent. This user agent can be spoofed however so it's not an ideal solution.
I ran into the same issue and adding step="any" at the field level fixed the issue for me.
It looks like IE10+ need a MIN and MAX value in order to work properly. If you defines these values it will work just fine with the 10000 value:
<input type="number" value="" step="0.00001" min="-100000" max="100000" name="quantity" id="id_quantity" />
Seems that step attributes for numer input just implemented as for Range Input which needs min, max and step values.
If really you are not able to define a min and max value, you must use Javascript to do that.

Passing two form variables in a single URL

I'm running the following form inside abc.cfm.
// Parameters Defined
<cfparam name="startdate" default="#DateFormat(dateAdd('d',-40,now()), 'yyyy-mm-dd')#">
<cfparam name="enddate" default="#DateFormat(dateAdd('d',-1,now()), 'yyyy-mm-dd')#">
<cfform format="HTML" action="datedownload.cfm" method="get" >
<cfformgroup type="horizontal">
<cfinput type="dateField" name="startdate" width="100" value="#startdate#">
<cfinput type="dateField" name="enddate" width="100" value="#enddate#">
<cfinput name="submitApply" type="submit" value = "Apply">
<cfinput type="button" name="download" value="Download" onclick="window.location.href='datedownload.cfm?startdate=#form.startdate#&enddate=#form.enddate#path=http://abc.xyz.com/username/July30/datedownload.cfm'">
</cfformgroup>
</cfform>
Everything is printing fine with the following code in datedownload.cfm
Startdate: <cfdump var = "#startdate#">
End Date :<cfdump var = "#enddate#">
Except that, the Enddate is printing full path along with it as follows:
Startdate: 2013-06-20 End Date : 2013-07-29path=http://abc.xyz.com/username/July30/datedownload.cfm
How can I remove the stuff starting from path?
If I am reading this correctly, you are getting an error that startdate and enddate are not defined in the form scope when you try to load download.cfm. Since you are passing those variables to download.cfm as part of a query string (by submitting the form using GET), they would not be present in the form scope.
I can think of 2 quick and easy solutions:
First, you can change your reference to form.startdate and form.enddate to url.formdate and url.enddate respectively. Variables passed in as part of the query string (like when you do a GET) become part of the url scope, not the form scope (liek when you do a POST).
Second, you can param the variables like this in download.cfm:
<cfparam name="url.startdate" default="#DateFormat(dateAdd('d',-40,now()), 'yyyy-mm-dd')#">
<cfparam name="url.enddate" default="#DateFormat(dateAdd('d',-1,now()), 'yyyy-mm-dd')#">
<cfparam name="form.startdate" default="#url.startdate#">
<cfparam name="form.enddate" default="#url.enddate#">
This will first param the values in the url scope to the same values you have in the page that displays the form, then it will param the same variable names in the form scope to the same value of the same variable names in the URL scope.
Use an ampersand before enddate instead of the question mark and add an ampersand before the path variable
window.location.href='Download.cfm?startdate=#form.startdate#&enddate=#form.enddate#&path=http://abc.xyz.com/<username>/Testing/Testing/Download.cfm'
The simplest way to solve your problem is to get rid of the 2nd button. It is not necessary and will confuse not only you, but your users. Since your form method is "get" the two formfields will be part of the url scope which seems to be what you want.
Also, where are the form variables coming from in the value attributes of your two inputs?
What's wrong with using a form post? That's the way I prefer to do it. I also test the request type (POST versus GET) to ensure that the download file isn't bookmarkable.
You'll need to use javascript to get the dates in the web-based form, not ColdFusion. (The user will also need to have javascript enabled to use the form to use location.href.)
Give your form fields matching IDs and try the following:
window.location.href='Download.cfm?startdate='+ document.getElementById('startdate').value +'&enddate='+ document.getElementById('enddate').value +'&path=http://abc.xyz.com/<username>/Testing/Testing/Download.cfm';
I'd recommend not using CFForm tags since they require the the /CFIDE/ directory and is currently recommended to be blocked:
Secure CFIDE Directory for ColdFusion
ColdFusion 9 Server Lockdown Guide (PDF)
ColdFusion 10 Server Lockdown Guide (PDF)
Make sure you perform date validation on the server-side. If you need client-side date validation, you can use HTML5 DOCType and the attributes type="date" & required or consider using the jQuery Validation plugin (preferable to CFForm validation).

Django: How can I invisibly pass a variable to another template?

I have three templates in my project—we'll call them first.html, second.html, third.html.
first.html gets a string from the user, using an <input> tag:
<input type="radio" name="selection" value="example_string" />
second.html displays this string using {{selection}}. (In my views.py, I got the value using request.POST.get and render_to_response().)
The question is: how do I send this value from second.html to third.html? One of my attempts—using a <span> tag to save the information in a variable—is illustrated below, but it doesn't seem to work.
<span name="selection" value={{selection}}>{{selection}}</span>
Edit: The following line works by creating a dummy single radio button. I don't know why it shouldn't be possible to create a variable without an <input> tag [visible to the user].
<input type="radio" name="selected" value={{selected}} checked="checked" />
You need to understand how the web works: each page is entirely separate, and is requested using a separate request.
Your basic options are: save data on the client side, or post it back to the server.
Both options can be performed with javascript, or posting back can also be performed by posting the form back to the server.
If you want to send it back to the server, it will have to be stored in the current session, or in a model.
There are many javascript libraries. If you want to use them, I suggest you google around the subject.
Answering my own question, now that I've found the answer on Django's documentation.
There's a special kind of <input> tag precisely for this: "hidden". The following line accomplishes the same as was asked in the question, but without a dummy element visible to the user:
<input type="hidden" name="selected" value={{selected}} />