Thursday, December 16, 2010

Input Validation for File Attachment Names

SharePoint does not allow special characters ([~#%&*{}<>?/+|\"]) in it's attachment names. 

I had an ItemAdded EventReceiver running on a WSS site.  And when I created an item, and added an attachment with a special character, I received the error message: "The file or folder name contains characters that are not permitted.  Please use a different name. ",

But the item would get created anyway. And the EventReceiver didn't fire.  I needed to do input validation on the client side before the item was submitted. 

  1. Add a Content Editor Web Part to the NewForm.aspx.
    1. Create a new list item
    2. Add &PageView=Shared&ToolPaneView=2 to the end of the URL in your browser
    3. Click Add a Web Part and select Content Editor Web Part from the Miscellaneous group
  2. Add the following code to the Source Editor
<Script type="text/javascript">
function PreSaveAction()
{
var attachment;
var filename="";
var fileNameSpecialCharacters = new RegExp("[~#%&*{}<>;?/+|\"]");
try {
attachment = document.getElementById("idAttachmentsTable").getElementsByTagName("span")[0].firstChild;
filename = attachment.data;
}
catch (e) {
}
if (fileNameSpecialCharacters.test(filename)) {
alert("Please remove the special characters from the file attachment name.");
return false;
}
else {
return true;
}
}
</script>

I used a javascript regular expression to check for invalid characters.

The user is prompted to remove the special characters from the file attachment.

14 comments:

  1. Can I include white space also in the reg expression?

    ReplyDelete
  2. This is really good. Can you help me to build the same for blank spaces as well?

    ReplyDelete
  3. You should be able to use '\s' for whitespace

    ReplyDelete
  4. love this post. how can I include an additional step to check if a file has been uploaded at all? in addition to the file name issue? been having some issues combining scripts and gettting them to work in the CEWP. right now I just check to be sure that an attachment was added, but I would like to prompt about the filename as well.

    ReplyDelete
  5. Hi...I am trying to do this for SP2010, however so far unsuccessful.
    Below are the steps that i have done:
    1) I created a text file and pasted the code as shown here.
    2) Uploaded the text file onto a shared library
    3) Added a content editor webpart in the content type form webpart for New as well as edit forms.
    4) pointed the source of the content editor to the shortcut link of the text file uploaded onto the sharepoint.

    ReplyDelete
  6. Thanks a lot, that's what I was looking for !

    in fact, you forgot the backslash in your regex, here it is :

    var fileNameSpecialCharacters = new RegExp("[~#%&*{}<>;?/\\\\+|\"]");

    ReplyDelete
  7. Just implemented this into the PreSaveItem() function for a custom list I have in SharePoint 2013. Works perfectly! Thanks very much.

    ReplyDelete
  8. just used this as well.. added the functionality to not allow spaces int he file name as it was messing up my links in infopath.. this saved me a ton of time!! thanks!!

    ReplyDelete
  9. This works great. I have it calling on the submit button. Only issue is that SP still throws it's own message and takes the user off the form. Anyway to prevent this or call it from the browse button on the attach screen?

    ReplyDelete
    Replies
    1. correction: not call from browse but call after attaching file from the attach page (don't know that name) at that point not the final form submission.

      Delete
  10. Hello,

    I had a similar requirement. I applied the above script within editform.aspx. It is working if I open the page in SharePoint 2010 environment. But practically when i try to edit an item, the item is being opened as InfoPath form. and the script is not working there.

    Can you suggest what is the method to short out this issue.

    ReplyDelete
  11. Oddness; sounds like this works great for everyone but me. The validation kicks in (message appears on save) for any attachment filename...thoughts?

    ReplyDelete
  12. Multiple attachments:

    function PreSaveAction()
    {
    var attachment;
    var filename="";
    var fileNameSpecialCharacters = new RegExp("[~#%&*{}<>;?/+|\"]");
    try {

    for(i = 0;i < document.getElementById("idAttachmentsTable").getElementsByTagName("span").length; i++)
    {
    attachment = document.getElementById("idAttachmentsTable").getElementsByTagName("span")[i].firstChild;
    filename = attachment.data;
    if (fileNameSpecialCharacters.test(filename)) {
    alert("Please remove the special characters from the file attachment name.");
    return false;
    }
    }
    return true;

    }
    catch (e) {
    return true;
    }

    }

    ReplyDelete