How to properly configure delete functionality with radajaxmanager with confirmation box?

I am using Telerik Grid control in which i am displaying list of records along with Update and Delete functionality.

Now i want to show confirmation box when deleting records so that user doesnt accidentally delete the record.

So here is my approach:

1)I have one master page i.e is MyMaster.Master which contains one common client side events for confirmation box which i would be using sweetalert for that:

function DeleteData(Id) {
   var ajaxManager = null;
   var action = 'Remove';
   ajaxManager = $find("ctl00_cphMain_RadAjaxManager2");
   var arg = action + "," + Id; //Remove,1(1 indicates id of record to remove from grid)
   ajaxManager.ajaxRequest(arg);This line will fire below method.
  }

2)I have created 1 Parentpage from which all of my page would be inherited and on this page my RadAjaxManager2_AjaxRequest would reside so that i dont have to pollute my every page with this method and this method will be responsible to handle my delete functionality on every page:

In this Method i will pass name of my delete method to fire.For Eg:Remove1

public class ParentPage : RadAjaxPage
{
    protected void RadAjaxManager2_AjaxRequest(object sender, AjaxRequestEventArgs e)
    {
     var stringArray = e.Argument.Split(",".ToCharArray());//[0]="Remove1",[1]=id of record to delete
     RemoveRecord( stringArray[0], stringArray[1]);
     }
}

3)My Page that is Abc.aspx where i would place my delete functionality to remove record from database and bindgridview:

<telerik:RadAjaxManager ID="RadAjaxManager2" runat="server" OnAjaxRequest="RadAjaxManager2_AjaxRequest">
                <AjaxSettings>
                    <telerik:AjaxSetting AjaxControlID="RadAjaxManager2">
                        <UpdatedControls>
                            <telerik:AjaxUpdatedControl ControlID="Grid1" />
                        </UpdatedControls>
                    </telerik:AjaxSetting>
                </AjaxSettings>
            </telerik:RadAjaxManager>
    <ItemTemplate>
      <asp:ImageButton runat="server" ID="Remove1" Text="Delete" OnClientClick='<%# Eval("Id", "javascript:return DeleteData(\"{0}\");") %>' />
      </ItemTemplate>
         public partial class Abc : ParentPage
            {
               protected void Page_Load(object sender, EventArgs e)
                {
                }
                private void RemoveRecord( buttonId, recordId) 
                {
                   if(buttonId== "Remove1")
                   {
                      //code to delete record with id of recordId
                      //Bind grid view again to display latest records after performing deletion.
                   }   
                }
            }

All this is working perfect but the problem is as we all know that when we inherit child page from parent page then we call parent page method from child page method but here in my case this is opposite that is i am calling my RemoveRecord method from parent page and that is i think it is inappropriate.

So i want to overcome this.How to properly configure my delete functionality???

The problem with your code is that you are mixing up the code for parent class, child class and master page. If code actually belongs to child class you are putting it in parent class or master page, which is a bad programming practice and will definitely cause a lot of issues and bugs. Also, your code would be very difficult and impossible to maintain.

Since you have RadAjaxManager in your child page i.e. ABC.aspx, so the event RadAjaxManager2_AjaxRequest should be placed in child page and not in parent page. You have placed this event in parent class i.e. in ParentPage class. The reason for this is explained in detail in paragraph below. Also, the JavaScript method DeleteData(Id) should not be in master page but in the actual child page, since this method is called in response to clicking delete button on child page.

One of the rules you must follow in object-oriented programming is that a class should only do what it's supposed to do and should not be doing what other classes are responsible for. In your case, ParentPage class should only contain code that provides base functionality for the child classes and not code that actually is functionality of a child class. Specifically speaking, the delete functionality is responsibility of child class and not parent class, so all code for delete functionality should be in child class, and also RadAjaxManager is part of child class, so all code related to RadAjaxManager including the event RadAjaxManager2_AjaxRequest should be in child class and not in parent class.

Doing this will allow you to write the delete functionality in the child page and not violate the principles of object-oriented programming. This will make it easy for you and other programmers to maintain your code, and also you will minimize bugs since your code will be clean and easy to follow.

Recommended topics

Hot tags