Friday, January 10, 2014

SharePoint - Check File Name in Upload form in Document Library with Javascript

If you want to check file name of new document in Upload form, you can do with Javascript!

I created a custom js that check filename then disables button OK if condition is not verified.


I override the function CheckAssetLibMediaExtension on event "onchange" of input file control in Upload.aspx.

If you see HTML Source of Upload.aspx (rendered by browser) you see:

<input name="ctl00$PlaceHolderMain$UploadDocumentSection$ctl05$InputFile" type="file" id="ctl00_PlaceHolderMain_UploadDocumentSection_ctl05_InputFile" class="ms-fileinput ms-fullWidth" size="35" onfocus="ResetSpFormOnSubmitCalled();" onchange="CheckAssetLibMediaExtension()" title="Scegliere un file" />

Search for function in HTML Source, you find:

function CheckAssetLibMediaExtension()
{

}

So, you can override it!

Create in masterpage reference to jQuery and add function below :

function CheckAssetLibMediaExtension(){
var inputFile = $("input[name$='InputFile']");
var nomeFile = inputFile.val().split('\\').pop();
if(!(nomeFile.indexOf('STRINGTOAVOID')>-1)){
           alert('Warning: file name not must contains "STRINGTOAVOID"!!');
   $("input[name$='btnOK']").attr('disabled','disabled');
   return;
}
        $("input[name$='btnOK']").removeAttr('disabled');
}

When user select file, InputFile control changes and function called.
Function show alert if fileName user try to upload has string "STRINGTOAVOID" in name.
Then, disables button OK, so user need to edit filename before select file.