I have two grid which contains delete button and I am using RadAjaxManager which will fire ajax request from client side to server side OnajaxRequest which contain event handlers and that event handler will call my delete event like below:
<telerik:RadAjaxManager ID="RadAjaxManager2" runat="server" meta:resourcekey="RadAjaxManager1Resource1" OnAjaxRequest="RadAjaxManager2_AjaxRequest">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="RadAjaxManager2">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="Grid1" />
<telerik:AjaxUpdatedControl ControlID="Grid2" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadGrid ID="Grid1" runat="server">
---
---
<telerik:GridTemplateColumn HeaderText="Action" UniqueName="Action" HeaderStyle-Width="130px">
<ItemTemplate>
<asp:ImageButton runat="server" ID="Remove1" Text="Delete" OnClientClick='<%# Eval("Id", "javascript:return DeleteData(\"{0}\");") %>' />
</ItemTemplate>
</telerik:GridTemplateColumn>
<telerik:RadGrid ID="Grid2" runat="server">
---
---
<telerik:GridTemplateColumn HeaderText="Action" UniqueName="Action" >
<ItemTemplate>
<asp:ImageButton runat="server" ID="Remove2" Text="Delete" OnClientClick='<%# Eval("Id", "javascript:return DeleteData(\"{0}\");") %>' />
</ItemTemplate>
</telerik:GridTemplateColumn>
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.
}
public event EventHandler RemoveEvent;
protected void RadAjaxManager2_AjaxRequest(object sender, AjaxRequestEventArgs e)
{
var argument = (e.Argument);
var stringArray = argument.Split(",".ToCharArray());//[0]="Remove",[1]=1
if (stringArray[0] == "Remove")
{
RemoveEvent(stringArray[1], null);
}
}
After this it will call this:
protected void Page_Load(object sender, EventArgs e)
{
this.RemoveEvent += Remove1_Click;
this.RemoveEvent += Remove2_Click;
if (!IsPostBack)
{
}
}
protected void Remove1_Click(object sender, object obj)
{
}
protected void Remove2_Click(object sender, object obj)
{
}
Problem here is both this events are calling but I just want to call individual delete events on click of Remove1 and Remove2 buttons.
You do not need to subscribe to events in your code-behind i.e. no need of
this.RemoveEvent+=
. Instead write a single method calledRemoveRecord(buttonId, recordId)
. I have explained this approach in a step-by-step manner as below.First change the markup for
OnClientClick
. Note that we will be passing the Id of the record to delete as well as the server-side id of the button being clicked to the JavaScript functionDeleteData
.Change the JavaScript
Delete
method. Note that we are now passing the server-side button id, so that in code-behind we can easily know which button was clicked.In code behind, include a single
RemoveRecord
method and there is no need of creating event handlers as you have done in your original code. So you should remove the following methods from your original code:Remove1_Click
andRemove2_Click
and also remove the code inPage_Load
that subscribes to click events.Another Approach
If you have to have
RadAjaxManager2_AjaxRequest
in parent page and delete methods in child page, then add the following code at appropriate places as mentioned in their titles. But please note that the markup changes and JavaScript function changes mentioned in above approach also apply to this approach.In Parent Page (just outside the class)
Also, in same parent page change the method
RadAjaxManager2_AjaxRequest
to what is given below.In Parent Page (change this existing method)
In Child Page (change existing methods)