JavaScript and RegEx not working on Safari...

[Ouch!]

I am using Regular Expressions and Javascript to validate a form,
specifically I want to make sure that if they try to upload a file that
it has a proper name w/ certain extensions (doc,pdf, rtf). The script
works on IE and Mozilla but fails on Safari on the MacOSX. Here is my
code..


// ok files with proper extension
var reOKFiles = /^([a-zA-Z].*|[1-9].*)\.(doc|DOC|pdf|PDF|rtf|RTF)$/;

//where i check for the file...
if(window.document.myForm.myDocument.value != ""){
var fileStr = window.document.myForm.myDocument.value;
if(!reOKFiles.test(fileStr)){
alert("Please try again, you tried to upload an invalid file type
for CRITERIA 1");
window.document.myForm.myDocument.focus();
return (false);

TIA.

 

[Michael Winter]

The script works on IE and Mozilla but fails on Safari on the MacOSX.

Care to be more specific? Those of us that can't test code on that
platform directly can't help you without a detailed error description.

[snip]

var reOKFiles = /^([a-zA-Z].*|[1-9].*)\.(doc|DOC|pdf|PDF|rtf|RTF)$/;

var filenamePattern = /^[a-z1-9].*\.(doc|pdf|rtf)$/i;

is much simpler, and would accept other, more usual (though valid)
capitalised forms of the extension.

//where i check for the file...
if(window.document.myForm.myDocument.value != ""){
var fileStr = window.document.myForm.myDocument.value;
if(!reOKFiles.test(fileStr)){
alert("Please try again, you tried to upload an invalid file type
for CRITERIA 1");
window.document.myForm.myDocument.focus();
return (false);

I would write this as:

var uploadDocument = document.forms.myForm.elements.myDocument;

if (uploadDocument.value
&& !filenamePattern.test(uploadDocument.value)) {
alert('You tried to upload an invalid file type for'
+ ' Criteria 1.\nPlease try again.');
if (uploadDocument.focus) {uploadDocument.focus();}
return false;
}

though the reference to the form control could be reduced under certain
conditions. For example, by passing a reference to the form element
(presumably this code is part of a function called from the submit event
listener) and storing a reference to the elements collection if multiple
elements are being validated simultaneously.

It probably wouldn't make much of a difference, but feature testing the
focus method isn't a bad idea.

Please follow-up by repeating the error message you receive, and what
might be triggering the error. Finally, don't use tabs when posting to
newsgroups; use spaces to indent (preferably never more than four per
level).

Mike

 

[Stephen Chalmers]

I am using Regular Expressions and Javascript to validate a form,
specifically I want to make sure that if they try to upload a file that
it has a proper name w/ certain extensions (doc,pdf, rtf). The script
works on IE and Mozilla but fails on Safari on the MacOSX. Here is my
code..


// ok files with proper extension
var reOKFiles = /^([a-zA-Z].*|[1-9].*)\.(doc|DOC|pdf|PDF|rtf|RTF)$/;

[a-zA-Z].*

Taking the above in isolation, it reads: a single alphabetic character
followed by any number of any characters whatever.

Assuming that you want to accept:

an alphanumeric string dot range-of-extensions

I suggest: /^[a-z1-9]+\.(doc|pdf|rtf)$/i;

 

[RobG]

Ouch! said on 31/03/2006 7:52 AM AEST:

I am using Regular Expressions and Javascript to validate a form,
specifically I want to make sure that if they try to upload a file that
it has a proper name w/ certain extensions (doc,pdf, rtf). The script
works on IE and Mozilla but fails on Safari on the MacOSX. Here is my
code..

In addition to what Mike said, remember:

1. Mac users don't have to use file extensions, particularly pre OS X.

2. A particular file extension is no guarantee that the file is of
a particular format.

3. Mac OS 9 (and earlier) used ':' as the separator for paths
rather than '/' or '\'


The above may be relevant, or not.

// ok files with proper extension
var reOKFiles = /^([a-zA-Z].*|[1-9].*)\.(doc|DOC|pdf|PDF|rtf|RTF)$/;

You appear to be testing the entire file path and allowing many
characters that aren't valid on most file systems. You also disallow a
path starting with a character other than a letter or number, but there
are many systems with paths that start with other characters, e.g. '/'
for UNIX (and similar) systems.

If you want to test just the file name, test just the file name using
criteria that are acceptable to your server. But even that is likely to
fail, so maybe just test the extension:

var reOKFiles = /\.(doc|pdf|rtf)$/i;

The vast majority of users will use the 'browse' button so the path is
filled in automatically. It is only relevant for their system, you
really don't care what it is.

//where i check for the file...
if(window.document.myForm.myDocument.value != ""){
var fileStr = window.document.myForm.myDocument.value;
if(!reOKFiles.test(fileStr)){
alert("Please try again, you tried to upload an invalid file type
for CRITERIA 1");

Perhaps you should say something along the lines of:

"This file doesn't appear to be the right format, please upload
only if you are certain it is in Microsoft Word or rich text
format, or Adobe PDF format."


The bottom line is that the extension does not define or guarantee the
file format. Many systems (including Macs) now hide the file extension
by default, so users may become confused if you refer to it.

Any testing you do at the client using JavaScript will fail in some
circumstances, so why not just upload the file and test it at the
server? What are the ramifications of a user uploading a file in the
'wrong' format? What is there in your script that stops them from
uploading it anyway?

Some simple work arounds: they can turn off scripting, change the
extension without changing the file format or spoof the file submission
and send the file anyway. There are probably more...

Sorry to be so negative, especially on Friday.

 

[Ouch!]

Dear Mike, Spethan, and RobG:

Thank you for all the replies. I will look over each post to see what
my next steps are. Also, I may not have been 100% accurate w/ my
original posting. Certian users, mainly MacOS users, see the alert
message "Please try again, you tried to upload an invalid file type
for CRITERIA 1" when uploading a valid file name such as myfile.doc.
Users on Windows Platform using Mozilla and IE only see the alert
message when they try to upload an invalid file format.

Again, thanks for your help.

 

[Ouch!]

Dear Mike, Stephan, and RobG:

Thank you very much for all the replies. I will look over each post to
see what my next steps are...At the very least it looks like I need to
refine my regular expression.

Also, I may not have been 100% accurate w/ my original posting.
Certian users, mainly MacOS users, see the alert message "Please try
again, you tried to upload an invalid file type for CRITERIA 1" when
uploading a valid file name such as myfile.doc.

Users on Windows Platform using Mozilla and IE only see the alert
message when they try to upload an invalid file format.

Again, thanks for your help.

 

[RobG]

Dear Mike, Spethan, and RobG:

Thank you for all the replies. I will look over each post to see what
my next steps are. Also, I may not have been 100% accurate w/ my
original posting. Certian users, mainly MacOS users, see the alert
message "Please try again, you tried to upload an invalid file type
for CRITERIA 1" when uploading a valid file name such as myfile.doc.
Users on Windows Platform using Mozilla and IE only see the alert
message when they try to upload an invalid file format.

I've tested it now on Mac OS 10.2.8 and 10.4.5 and as I suspected, Mac OS,
being UNIX-based, has file paths like:

/Users/fred/Documents/fred.doc

Your regular expression doesn't allow leading forward slashes - the same
thing will happen with other UNIX-based OSs like Linux I expect.

You can try to just test the extension (as suggested in my other post), but
that doesn't really check the file format anyway.