Approve multiple documents or list items in one operation with client side code

You find an updated version here: https://spjsblog.com/2015/05/18/approve-or-reject-list-items/

I got this request from Larry:

Good day A, Have a question. Is there an easy way to add to the SP 2010 ribbon an approve all button. I hate having to select each item and manually approve each one. I have found some script but they are deployed on central admin. I would like to a void that.

thanks

It’s not like i didn’t have anything to do, but he bought me a beer…

Here we go

This one uses the Client Object Model in SharePoint 2010 and is therefore usable in SharePoint 2010 only.

The code adds a custom button to the “Ribbon.Document” or “Ribbon.ListItem” that calls a script on the items selected using the in line checkbox.

Get the file “ApproveSelected.js” from here
Get jQuery from here

Put the files in a document library or in a folder created with SharePoint Designer. Ensure all users have read access to the location.

Insert a CEWP in the list view where you want this feature to be activated. Use the “Content Link” option in the “Edit web part” panel of the CEWP to link to the CEWP-code that you have put in a text file in the same location as the “ApproveSelected.js”.

Use this code:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript" src="/test/Scripts/ApproveSelected/ApproveSelected.js"></script>
<script type="text/javascript">

var tabBtn = {
	"btnLabelApprove":"Approve selected",
	"btnLabelReject":"Reject selected",
	"groupLabel":"Approve or reject"
};
var workingOnItNotification = 'Processing items...';
var doneNotification = '{0} items processed';
</script>

Change the path to the file “ApproveSelected.js” to match your local copy. If you prefer to use a local copy of jQuery, change that path to.

You may also change the variables if you want another text in the button or the notification messages.

It should look like this in the list view

Inactive
IMG

Active
IMG

NOTE
The button will disappear if the screen width is to narrow. The built in ribbon buttons will “shrink” to fit a narrow screen – this one will not.

Extras

This code uses a new “hack” to overcome the missing “list toolbar” when adding another webpart to the page. I’ll do a separate little article on that one.

Enjoy!
Alexander

49 Comments on “Approve multiple documents or list items in one operation with client side code”

  2. To check in multiple documents at once I use Harmon.ie ‘s ‘addin’ to Outlook. It allows you to select more than one document and check them in all from within Outlook. Very handy.

    1. Hi,
      Yes, if the workflow is set to trigger on change you could modify this script to set the “trigger field” to the appropriate value.

      Alexander

      1. Hi Alexander,

        Will you please tell me how to set the “trigger field” in the script?

        Regards,
        Gomathy

  4. Hi Alex,

    Thanks for the code. Is it possible to use this code for any other field?
    I have dropdown field with values Save as Draft, Submit, Approved and Rejected. So is it possible to change the dropdown value from Submit to Approved using ribbon button?

    Thanks in advance

    1. Hi,
      Yes this should be possible. You must change the function “checkAndUpdate” to achieve this. Look at the field “_ModerationStatus” – this is the one you should change for your “dropdown field”.

      Alexander

  6. Hi Alexander,

    I need to implement same functionality(Multiple Approval for ListItems) on SP list where it has Approval workflow.I tried with your code but status is not get updated with proper value it shows as Blank.

    1. I’m not sure if you can bypass the Approval WF using this solution. What this solution does is to update the status field with the correct value, but if you have a WF, this might prevent you from changing the value – or it changes it back to what it was. I’m actually not sure about this, but If you can make it work in a list without the WF – and not in a list with WF – I imagine this must be the case.

      Alexander

    2. Hi Bernard, if didn’t work with you then most probably this because your items are in sub-folders so the query couldn’t get them. To fix this issue you may need to edit the CAML query in the ApproveSelected.js file, and change this line:
      From: qb.push(“”);
      To: qb.push(“”);

      to make sure that it will query all nested items.

      1. Hi Wassim,

        Im a rookie when it comes to code.

        Could you please inform with what text should be switched out and put in regarding (Scope=’RecursiveAll’)

        Br Bertrand

  12. Hi, after extensively searching online for a solution that I need (and like), this is it! But, as a new Developer to SharePoint, how do I change the code to modify a checkbox field (yes/no)?

  13. Been searching for a solution for days and finally stumbled upon this solution. Is it possible to put code behind a cewp button that when clicked would change contents of a field (status) in the selected documents?

  14. Looks like exactly what I need but just installed as instructed in SP 2010 and the directory and items ribbons do disappear 🙁

    thanks anyway

  15. It isn’t working for me. I’m using SP 2013.
    curr.get_item(‘_ModerationStatus’)
    is always returning 0 regardless of whether an item is approved or not.

  17. Hi,

    I know this post is old but would love to get this working. I do not have access to sharepoint designer as my company has disabled it. When i do the content link part all that happens is the text is copied from the doument libray but doesnt add a button once I add the java code. Any help would be great.

    Thanks,

    Thomas

  18. Hi,
    Sorry for the late reply. It’s hard to tell what could be without looking at it, but it sounds like you may have linked directly to the *.js file and not to a text file containing this code as described in the content link field on the CEWP. Add this to a txt file and link to it in stead:

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript" src="/test/Scripts/ApproveSelected/ApproveSelected.js"></script>
<script type="text/javascript">

var tabBtn = {btnLabel:’Approve selected’,groupLabel:’Approve’};
var approvingItemsNotification = ‘Approving files…’;
var approvingItemsDoneNotification = ‘{0} items approved’;
</script>

    You must change the src for the scripts to point to your local files.

    Alexander

  19. Thank you your solution worked. It did not at first, but in your response to Sriranga above you suggested looking for errors in the developer console. Turns out the apostrophes bracketing ’Approve selected’,groupLabel:’Approve’ above were not recognized by my script. Just changed them and now it works clean. Thanks again this is great!

      2. If there is no errors I’m afraid I cannot do much without looking at your site. Unfortunately I don’t have time to do this now.

        Which version of SharePoint are you using? – I have only tested this code in SP 2010.

        Alexander

  22. Thank you for your nice code.its working for me to approve the item.
    i want reject also in the same ribbon.like Approve selected items & reject seleted multiple items …is it possible…can yot tell me the steps.

    1. Hi,
      If you open the script file and look for “_ModerationStatus”, you see where the value is set. “Rejected” would be “1” instead of “0” for “Approved”.

      Feel free to modify the code to your needs by adding a second ribbon button for “Reject”, and duplicating the functions “approveSelected” and “checkAndUpdate” or adding a function argument to select “approve” or “reject”.

      Alexander

  23. Hi Alexander
    Thanks for your replay.As per my understanding ur saying instead of approve change rejected in the js code.

    B ut what im asking same ribbon i need another icon like reject .it means user wants to approve they can go Approve selected icon and if they want reject multiple approve they can go another icon….simple im asking two button…1.Approve 2.Reject

  24. Thank you so much Alexander.Really ,impressed your attitude for helping others.

    Recently i checked you reply for rejection.it’s simply awesome!!!

    Meanwhile i have tried with some other method like wise maintain two different .js file .it was working fine .But i have one doubt for this line “src=’/_layouts/1033/images/formatmap32x32.png'”…..i have changed my image for reject button.But same image only displaying. Is there any way to change the another image for rejection button.

    1. Hi,
      The image “formatmap32x32.png” is a mosaic of different images, and you must use the top and left parameter in the image tag to home into the square you want to show. Load the image URL in a browser window to see the full image map.

      Alexander

  25. Sir can you show me the screenshot of how you link that with the CEWP.
    i did copy all the code as shown below:

    change its source to my local machine path and i tried to copy path but though its not URL i am not able to see that button in my ribbon so may be you can help how to do that.

      1. Thank you for Reply Sir.
        As i am using SPD2010 where or how can i upload that files or where should i upload that so i can give that link in the content to show that approve all in my ribbon.

  26. Its works.
    its showing me a button which is with a text undefined and i tried to click that button but its not working. and i even tried with the aprovedorreject.js still the same thing its not working.

    1. Hi,
      There must be something wrong with your setup, but It’s impossible to tell what is wrong without looking at it.

      Could you possibly try to remove all and try setting it up again form scratch?

      Alexander

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.