#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2013
    Posts
    6
    Rep Power
    0

    File Upload Client Side Validation


    I am using the following client side validation for a file upload to ensure selected file types only:

    return value.match(/\.(pdf|tif|jpg|doc|docx)$/i);

    Now I'd like to prevent special characters, and add a max length of 20:

    Although not fully tested yet, so far I have:

    return value.match(/\\([A-Za-z0-9\-\_\s]+)*\.(pdf|tif|jpg|doc|docx)$/i);

    However, I have not yet figured out how to add the max length portion.

    Any help would be greatly appreciated.

    Thanks!
  2. #2
  3. Did you steal it?
    Devshed Supreme Being (6500+ posts)

    Join Date
    Mar 2007
    Location
    Washington, USA
    Posts
    13,965
    Rep Power
    9397
    If you don't mind 21 characters for .docx you can put a limit of 16 on the first part: +1 for period +3 for extension = 20.

    Otherwise (a) use another regex or (b) a lookahead
    Code:
    /\\(?=.{1,20})([A-Za-z0-9-_\s]+)\.(pdf|tif|jpg|doc|docx)$/i
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2013
    Posts
    6
    Rep Power
    0
    Thank you requinix. However, it does not pick up the max length validation. I can still upload files with names longer than 20 characters.
  6. #4
  7. Did you steal it?
    Devshed Supreme Being (6500+ posts)

    Join Date
    Mar 2007
    Location
    Washington, USA
    Posts
    13,965
    Rep Power
    9397
  8. #5
  9. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2013
    Posts
    6
    Rep Power
    0
    You are awesome. Thanks so much for the help!
  10. #6
  11. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2013
    Posts
    6
    Rep Power
    0
    After some testing, I found that this denies all files when using Firefox.

    Any additional suggestions?
  12. #7
  13. --
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2012
    Posts
    3,957
    Rep Power
    1046
    Hi,

    we can't tell you what's wrong if we don't know what your input looks like. For the test string 'abc\\test.jpg', the regex works perfectly in every browser I've tested (Firefox 22, Chrome 28 and IE 10).

    You do realize that the regex expects a Windows-style backslash in the input?
    The 6 worst sins of security ē How to (properly) access a MySQL database with PHP

    Why canít I use certain words like "drop" as part of my Security Question answers?
    There are certain words used by hackers to try to gain access to systems and manipulate data; therefore, the following words are restricted: "select," "delete," "update," "insert," "drop" and "null".
  14. #8
  15. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2013
    Posts
    6
    Rep Power
    0
    In Firefox 5, the upload path is C:\Upload\Test.docx
  16. #9
  17. Did you steal it?
    Devshed Supreme Being (6500+ posts)

    Join Date
    Mar 2007
    Location
    Washington, USA
    Posts
    13,965
    Rep Power
    9397
    Code:
    "C:\\Upload\\Test.docx".match(/\\(?=.{1,20})([A-Za-z0-9-_\s]+)\.(pdf|tif|jpg|doc|docx)$/i)
    Code:
    ["\\Test.docx", "Test", "docx"]
    Works for me.
  18. #10
  19. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2013
    Posts
    6
    Rep Power
    0
    I was incorrect. In Firefox, it is the file name only, and no path.
  20. #11
  21. Did you steal it?
    Devshed Supreme Being (6500+ posts)

    Join Date
    Mar 2007
    Location
    Washington, USA
    Posts
    13,965
    Rep Power
    9397
    Swap the leading slash with "a slash or the beginning of the string".
    Code:
    /(^|\\)

IMN logo majestic logo threadwatch logo seochat tools logo