1

On SharePoint list, normal we have Save and Cancel option when user fill new form. User want one more button "Save as draft". So user can fill form with some data and then after user need to fill data later.

Actually we have Microsoft flow exist on the list. So when user click on "Save" button then flow will start. But if user click on "Save as draft", item need to save on list but flow need not to start.

Can anyone suggest us, how to achieve on this. Any JS code, please share us.

Note: We are using SharePoint online and Normal SharePoint list.

0

You can add a column named "Status", which will have 2 values, "Draft" and "Submitted". Use the below code in your newitem.aspx, add it using content editor webpart or script editor webpart, it will add a new button "Submit", on click of Save, the status will be set to "Draft" and item will be saved. On click of "Submit" the status will be set to "Submitted" and item will be saved in the list, then in your MS flow, if the item status is set to "Submitted" then you can start the MS Flow otherwise the status will be in "Draft", you can allow the user to edit it.

You can create 2 views, for draft items --> create view where status is equal to "Draft" and for submitted items, create view where status is equal to "Submitted."

    <script type="text/javascript">
$(document).ready(function(){
    var customizeSaveSubmitBtns = function(){
        try{
            // Add a Submit button after Save button 
            var btnSave = $("input[id$='SaveItem']:last");
            var btnSaveName = btnSave.attr("name");
            btnSave.clone().attr('id', 'btnSubmit').attr('name', 'btnSubmit').attr('value', 'Submit').insertAfter(btnSave);

            // Set Submit button onclick behavior
            $("#btnSubmit").attr("onclick","if(!setStatus('Submitted')) return false; if (!PreSaveItem()) return false;if(SPClientForms.ClientFormManager.SubmitClientForm('WPQ2')){ return false;}; WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions('"+btnSaveName+"','',true, '', '', false, true))");
            // Set Save button onclick behavior
            btnSave.attr("onclick","if(!setStatus('Draft')) return false;if (!PreSaveItem()) return false;if (SPClientForms.ClientFormManager.SubmitClientForm('WPQ2')) {return false};WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions('"+btnSaveName+"', '', true, '', '', false, true))");

            // Put a gap between save and submit buttons
            $("#btnSubmit").before("&nbsp;");

            // Set the click event of cancel button
            var btnCancel = $("input[id$='GoBack']:last");
            btnCancel.attr("onclick","redirectToAllitemsPage(); return false;");
        }
        catch(ex){
            logError(ex.message, ex.stack);
        }
    };



    ExecuteOrDelayUntilScriptLoaded(processForm, "sp.js");
    function processForm(){
        customizeSaveSubmitBtns();
    }
});

// Set the status as draft/submitted field based on save or submit action and perform other validations/tasks
    var setStatus = function(status){
        try{
            // Set the status column, here the column name is case sensitive.
            SPUtility.GetSPField('status').SetValue("");            
            //$("input[title*='status']").val(status);          
            return true;
        }
        catch(ex){
            //logError(ex.message, ex.stack);
            return false;
        }
    };

    // Redirect to all item view
    function redirectToAllitemsPage(){
        window.location.href = "AllItems.aspx";
    }

</script>

The above approach uses SPUtility.js If this answer helped you, kindly upvote and mark it as answer, so that it will help others too :)

| improve this answer | |
  • yes, updated the answer. – Karthik Jaganathan Dec 13 '19 at 6:13
  • yes sure, you can use it. I tested it in SP 2013 – Karthik Jaganathan Dec 13 '19 at 6:17
  • If this answer helped you, kindly up vote and mark it as answer, so that it will help others too :) – Karthik Jaganathan Dec 13 '19 at 6:19
  • Hi Karthik, unable to "save" or "submit" or "cancel" the form after implementing code. i am getting error on console as. "Exception while trying to access stylesheet rules: SecurityError: init.js:1 Failed to read the 'cssRules' property from 'CSSStyleSheet': Cannot access rules" Uncaught ReferenceError: setStatus is not defined at HTMLInputElement.onclick (NewForm.aspx?Source="newfrom.aspx url"................................. Kindly suggest – murali kuruva Dec 15 '19 at 6:42
  • I have altered the code. Kindly try now – Karthik Jaganathan Dec 15 '19 at 8:08

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.