We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to add custom Buttons in dialog editing

How to add “Custom buttons in edit dialog instead of save and cancel button”

Please follow the below steps to add custom buttons in edit dialog by removing existing buttons at Onload event.

  1. Remove the existing Save and cancel button from edit dialog.

$("#GenericListGridsfEditButtons").children().remove(); //here GenericListGrid is Grid ID

  1. Append the custom buttons to edit dialog with necessary styles

$("#GenericListGridsfEditButtons").append("Add your custom button here");

  1. Perform your required action by binding required event to custom buttons.

[CSHTML]

 

   @(Html.Syncfusion().Grid<Student>("GenericListGrid")

 

     ...

 

     .ClientSideEvents(events => events.OnLoad("actionLoad")) // client

               Side Onload event initialized

 

     ...

 

   )

 

 

[SCRIPT]

 

   function actionLoad(sender) {

  $("#GenericListGridsfEditButtons").children().remove();

   $("#GenericListGridsfEditButtons").append("<button type='Button'

        style='height: 30px; width: 85px;' name='SaveandClose'

        id='GenericListGridEditSaveandClose' class='sf-

      button Metro background' onClick='actionClick(event)'>Save &

        Close</button> &nbsp &nbsp <button type='Button' style='height: 30px;

        width: 75px;' name='SaveandAdd' id='GenericListGridEditSaveandAdd'

        class='sf-button Metro background' onClick='actionClick(event)'>

        Save & Add</button>");

   }

 

  function actionClick(e) {

    var gridobj=$find("GenericListGrid");

     if (e.target.textContent == "Save & Close")

        gridobj.sendSaveRequest(); // Bind any events here

     else {

        gridobj.sendSaveRequest();

        gridobj.sendAddNewRequest();

     }

   }

 

 

 

 

 

 

 

The sample output is shown below,

 

Fig

Article ID: Published Date: Last Revised Date: Platform: Control: .NET Framework: Product Version:
2356 07/08/2014 07/10/2014 ASP.NET MVC (Classic) Grid 4.5 12.1.0.43
Tags:
Did you find this information helpful?
Comments
Oscar Daniel Vega Castaneda Nov 27, 2015
How I can do this on ASPX webform????
Reply
lopez2041 Dec 11, 2017

How I can do this on ASP webform, I have two days looking for that, I am using ad Dialog but the save button is not working

Reply
Add Comment
You must log in to leave a comment

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon