0

I am trying to add one new custom button near the save button on a newform.aspx of my list in a SharePoint Online site.

Here is the current content editor web part (CEWP) code in the newform.aspx, which needs improvement: 

    <script src="https://code.jquery.com/jquery-1.10.2.min.js" 
   type="text/javascript"></script>
     <script type="text/javascript">
    $(document).ready(function () {
    // for Save button
     alert(' docu ready');

     var saveCancelText='<input type="button" id="saveBtn" value="Save1233" class="ms-ButtonHeightWidth"></input>&nbsp;&nbsp;&nbsp;<input type="button" id="cnclBtn" value="Cancel" class="ms-ButtonHeightWidth" 
    onclick='javascript: if( PreSaveAction() ) 
   {ddwrt:GenFireServerEvent('__commit')}'  ></input>';

 $(".ms-formtoolbar > tbody > tr").append(saveCancelText);

Running the code fails to show the custom button because of onclick event

  ` onclick='javascript: if( PreSaveAction() ) 
   {ddwrt:GenFireServerEvent('__commit')}'`

How can I call the onClick event inside document.ready? I can't call this on presaveaction().

Any idea how I can trigger an event on click of this custom save button and call PreasaveAction and perform my custom validation? I want to redirect to a different page, editform.aspx with an ID in the querystring parameter.

Improve this question
  • You just want to redirect to edit form of that newly created item? @pradadwt – Sohail Shaikh Oct 24 '18 at 17:04
2

Modify the code as below to call the onclick event of custom buttons inside document.ready.

<script src="https://code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () { 
    var saveCancelText='<td><input type="button" id="saveBtn" value="Save1233" class="ms-ButtonHeightWidth"></input></td><td><input type="button" id="cnclBtn" value="Cancel" class="ms-ButtonHeightWidth"></input></td>';
    $(".ms-formtoolbar > tbody > tr").append(saveCancelText);
    //custom save button click event            
    $(document).on("click", "#saveBtn", function(){
        alert("savebtn click!");
    });
    //custom cancel button click event
    $(document).on("click", "#cnclBtn", function(){
        alert("cnclBtn click!");
    });
});
</script>

If you only want to redirect from newform page to edit form page, we can get last item id of list using REST API and redirect the edit form page.

Reference: Customize newform save button - Save and redirect to another form

Improve this answer
  • am facing multiple issues, while redirecting with ID="+newlycreatedID, and AND IT ALWAYS redirecting to allitems.aspx.. in the second approach , i tried by changing the code in the ?source querystring paarameter , it goes to editform,without querystring param.! if i use the above mentioned customs ave button, can i implement jsom, by accessing the fields, explicitly and submit the data into splist, without using presaveaction? – dasarp Oct 25 '18 at 9:00
  • We can validate list fields data and using REST API with jQuery Ajax to add item to list directly. And in the success method of ajax, we can get the list item id, and redirect edit page. Refer to: c-sharpcorner.com/article/… – LZ_MSFT Oct 25 '18 at 9:11
  • @LZ_MSFT What if the last item is deleted? – Sohail Shaikh Oct 25 '18 at 16:00
1

Add the below code in CEWP below NewForm.aspx:

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

function PreSaveAction(){
    var URL = location.pathname.replace('NewForm.aspx','EditForm.aspx');
    if(GetUrlKeyValue('IsDlg')==='1'){
        URL+="?IsDlg=1";
    }
    $("#aspnetForm").attr('action',location.pathname+"?Source="+URL);
    return true;
}

</script>

Reference: Redirect from NewForm to Disp/Edit Form

Improve this answer
  • when i tested the above code, it navigates to the EditForm, without the newly created ITEMID . I wanna attach the ID of the last created item in this EditForm. – dasarp Oct 25 '18 at 9:28

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.