Before I start - I'm new to this SharePoint development lark and am slowly familiarising myself with it.

We're using SharePoint online and I have amended the SharePoint out-of-the-box document library to include some extra fields that are required when the user adds a new document.

If the user creates or uploads a new document then they are prompted to enter the required information. However if they use the drag and drop functionality the entry of the necessary fields is bypassed.

During my search I came across this post which asks how to enforce metadata entry (which would be another good option for me). It also mentions disabling the drag and drop functionality by editing dragdrop.js and removing content from various methods.

I've had a look at the site collection I'm working on (to which I have full control) and I can't seem to find dragdrop.js (or the layouts folder for that matter).

  • Is this something that's held at site collection level or is it held at a higher level?
  • I don't have admin rights above my site collection, do I need them?
  • Do I need to use Visual Studio to make the necessary changes? (Currently I'm doing things through the web and having a bit of a play with Napa I don't have Visual Studio installed)
  • When I get there is it obvious what methods need to be removed?
  • How can I tell SharePoint to use the new version of dragdrop.js? Is it just a case of saving a copy of the existing one to a different name and then editing the existing file?

I suppose the best place for me to have asked this question would probably have been on the existing post, but I am unable to post a comment on there, sorry...


here is a better solution. Enjoy and let me know if you need more help :)

ExecuteOrDelayUntilScriptLoaded(function() {
    g_uploadType = DragDropMode.NOTSUPPORTED;
    SPDragDropManager.DragDropMode = DragDropMode.NOTSUPPORTED;
}, "DragDrop.js");
  • I am having lsit view veb oart on the page and i want to disable the drag drop . For that i have added a CEWP with a js having above snippet .but still able to drag drop the file into that . Please help me out . – user27178 Oct 14 '15 at 11:17

The layouts folder is not Site Collection specific, it is used for all sites in a farm.

You find it in the web frontend servers at this path: C:\Program Files\Common Files\microsoft shared\Web Server Extensions\15\TEMPLATE\LAYOUTS

To modify items here you will need to have access to the folder directly, or have permissions enough to add and install a SharePoint Farm solution.

With that said, you should avoid messing with the OOTB files in SharePoint, you are in danger of voiding your warranty!

  • Robert, thanks for the reply. This is not a local install of SharePoint, it is a hosted solution - there is no 'C:\' drive. When I say OOTB, it's an instance of the Document Library web part that I'm amending - not the Document Library content type itself. – TonyR Nov 14 '13 at 15:17
  • 2
    The layouts folder still exists on the file system, but naturally you can not modify it in a hosted environment since that would impact all tenants – Robert Lindgren Nov 14 '13 at 15:31

From the Library Menu if you select Modify View and change 'Style' to 'Shaded' it will remove the drag and drop. You end up with more of a list view.

  • I'm running into the same situation on a client's SharePoint 2010 site. @lbp I tried changing the style and was hopeful that would work but I am still able to drag and drop. – Sandy Mason Apr 1 '15 at 17:02
  • Changing to Shaded it also will render the list at server, so no CSR is possible anymore – Emaborsa Aug 28 '18 at 9:44

I've found that if you use enable the minor-version functionality it will keep documents that are dropped into the library checked-out until all required metadata is entered. This prevents other users from seeing the document


You can disable this with css by setting the drag and drop div style to display: none !important. The !important is required to override the inline styles which are set dynamically.

For pages with a single document library use the id or class e.g.

#ms-dnd-dropbox{ display: none !important; }
.ms-dnd-dropbox{ display: none !important; }

For pages with multiple document libraries when you want to target a specific library prepend the id of the web part div and an underscore e.g. WebPartWPQ4_

#WebPartWPQ4_ms-dnd-dropbox{ display: none !important; }

Add following Style & Script to your master page:

<style type="text/css">
    /*-- Hide Drag & Drop --*/
    caption.ms-dragDropAttract {
        caption-side: bottom;
        display: none !important;
<script type="text/javascript">
    /*-- Stop Drag & Drop --*/
    ExecuteOrDelayUntilScriptLoaded(function () {
        g_uploadType = DragDropMode.NOTSUPPORTED;
        SPDragDropManager.DragDropMode = DragDropMode.NOTSUPPORTED;
        SPDragDropManager.DargDropMode.style.display = "none";
    }, "DragDrop.js");
  • SPDragDropManager.DragDropMode is a number, how could we set a style on it? – Emaborsa Jan 22 at 10:28

For disable Drag and Drop functionality add below code in "Script Editor".

Go to Setting -> Edit Page -> Insert -> Web Part -> Media and Content -> Script Editor and refresh the library.

    ExecuteOrDelayUntilScriptLoaded(function() {
             g_uploadType = DragDropMode.NOTSUPPORTED;
             SPDragDropManager.DragDropMode = DragDropMode.NOTSUPPORTED;
        }, "DragDrop.js");

That's definitely works. I had tried.


This is may be old post but I am posting it if it helps for others.

  1. Disable Drag and drop functionality
  2. Remove "or drag files here" from the +new document or drag files here.

use the below script by adding to each page as script editor or add it to master page.

  <script type="text/javascript" src="http://code.jquery.com/jquery-
<script type="text/javascript">
   ExecuteOrDelayUntilScriptLoaded(function() {
   g_uploadType = DragDropMode.NOTSUPPORTED;
   SPDragDropManager.DragDropMode = DragDropMode.NOTSUPPORTED;
   }, "DragDrop.js");

     if($(".ms-list-addnew span:eq(1)").text()=="new document"){
      $(".ms-list-addnew span:eq(1)").closest("td").html(function(index,oldhtml){ return oldhtml.replace('or drag files here',''); }); }});
  • Do not use jQuery if standard functions are available! For edit the AddItemButton use CSR. – Emaborsa Aug 28 '18 at 9:47

If it's IE only, you can force the rendering engine to run in say IE8 mode, which will disable drag n' drop entirely. that would require you customizing the page and updating the META tag, I don't believe there is another way from the page to do it.

Theoretically, you are correct. If you load in another JS file with same function names AFTER the original has loaded it should supersede any function calls with your customer functions. I would rename the file however so you can trace it's loading and the function calls to ensure it is working as expected.

  • Thanks Jesus - not all our users will use IE, some PC users use Chrome and our Mac users use Safari. – TonyR Nov 15 '13 at 8:29

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.