Trigger A SharePoint Workflow From JavaScript

Intro

 
Sometimes, we get the requirement to start a SharePoint workflow from JavaScript code or have to rerun a work on all existing list items and want to give an easy option to users to trigger a workflow on all items, then this the solution will help you.
 
We’re basically triggering a workflow from JavaScript code and you have the option to rerun workflow on all items or on a few items based on your requirement.
 
Prerequisites
 
We need SPServices JS file reference to use this solution and I think we can use SharePoint REST API as well to trigger a workflow. But you need to update code a little bit and REST API endpoints may not work with SP2010.
 

Steps

 
Save the below code in a text file by updating the global variable to point out to the List, Workflow name, and Workflow Template ID.
 
I selected all items to trigger workflow but if you have to filter the result then update query in REST call. I used logging to make sure the code runs correctly. You may discard the console logging if you want.
 
Update the HTML code block as I have used <span> to show a message and a button to trigger a JavaScript function, you can update it as per your need.
 
Finally, upload this text file to the Site assets folder of your SharePoint site and refer it in the content editor web part to render the HTML and code on-page.
 
Code
  1. < !DOCTYPE html > < script > < /script> / / add the SPService webservice reference here..... < script type = "text/javascript" >  
  2.     //global variables  
  3.     var workflowName = ""//Name of your workflowName  
  4. var listName = ""//list name on which workflow is configured  
  5. var listGUID = ""// list listGUID  
  6. var tempalteID = ""//Workflow temaplte id, you will get this tempalte id and list guid both on workflow start page.  
  7. //This function will trigger on button click and itemrate on items of mentioned list to start workflow.  
  8. function RunWorkflow() {  
  9.     var context = SP.ClientContext.get_current();  
  10.     if (context != null) {  
  11.         $.ajax({  
  12.             async: true,  
  13.             //you can use either one method - getbytitle() or getbyid() to get list items from list.  
  14.             url: _spPageContextInfo.webAbsoluteUrl + "/api/web/lits/getbyid(guid'" + listGUID + "')/items/?$top=1500,  
  15.             //url: _spPageContextInfo.webAbsoluteUrl +"/api/web/lits/getbytitle('"+listName +"')/items/?$top=1500,  
  16.             method: "GET",  
  17.             headers: {  
  18.                 "accept""application/json;odata=verbose",  
  19.                 "content-type""application/json;odata=verbose"  
  20.             },  
  21.             success: function(data) {  
  22.                 if (data != null || data !== "" || data !== undefined) {  
  23.                     console.log("Total item count is:" + data.d.results.length);  
  24.                     for (var i = 0; i < data.d.results.length; i++) {  
  25.                         var item = data.d.results[i];  
  26.                         console.log("workflow starting on item: " + item.ID);  
  27.                         //calling function to pass item id to start workflow instance on it.  
  28.                         startWorkflow(item.ID);  
  29.                     }  
  30.                 }  
  31.             },  
  32.             error: function(error) {  
  33.                 JSON.stringify(error);  
  34.             }  
  35.         })  
  36.     }  
  37. }  
  38. //this function triggers workflow on given input list item id.  
  39. function startWorkflow(itemId) {  
  40.     var url = _spPageContextInfo.webAbsoluteUrl + "/Lists/" + listName + "/" + itemId + "_.000";  
  41.     $().SPService({  
  42.         operation: "StartWorkflow",  
  43.         item: url,  
  44.         async: true,  
  45.         temaplteId: tempalteID,  
  46.         workflowParameters: "<root />",  
  47.         completefunc: function() {  
  48.             console.log("workflow started on item :" + itemId);  
  49.         }  
  50.     });  
  51. }  
  52. </script>  
  53. <body>  
  54.     <!-- you can add HtmL code here and invoke the RunWorkflow() fucntion. I used here simple button -->  
  55.     <div class="row">  
  56.         <span>  
  57.             <h2> Click on below button to run a workflow.</h2>  
  58.         </span>  
  59.         <br/>  
  60.         <br/>  
  61.         <button type="button" class="btn btn-primary" onclick="RunWorkflow()"></button>  
  62.     </div>  
  63. </body>undefined</html>  

Conclusion

 
We can leverage client-side code to trigger the SharePoint workflow and even update the current context. We can trigger the workflow out of SharePoint.