Hi,
I have a page with an update panel and a repeater inside the panel. I have a multi view inside the repeater item template. In that multiview, I have a view with a delete button and a confirm button extender. When you click on the delete button, the confirm alert appears (not always), but at the same time an asyncrhonous postback occurs, the record is deleted by the code behind page and the page is refeshed, but you have not clicked 'OK' nor "Cancel" yet.
Note: Using Beta
Here is the web page:
<%@dotnet.itags.org. Page Language="C#" AutoEventWireup="true" CodeFile="Templates.aspx.cs" Inherits="Templates" %>
<%@dotnet.itags.org. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="sm" runat = "server" />
<asp:ObjectDataSource ID="CategoriesDataSource" runat="server" OldValuesParameterFormatString="original_{0}" SelectMethod="GetCategories" TypeName="DataLayer.ProtocolCategory"></asp:ObjectDataSource>
Select a category:
<asp:DropDownList ID="CategoriesDropDown" runat="server"
DataSourceID="CategoriesDataSource" DataTextField="CategoryName"
DataValueField="CategoryID" Width="250px"
AutoPostBack = "true" />
<br /><br /><hr /><br />
<asp:UpdatePanel ID="up" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:ObjectDataSource ID="TemplatesDataSource" runat="server" OldValuesParameterFormatString="original_{0}" SelectMethod="GetTemplates" TypeName="DataLayer.ProtocolTemplate">
<SelectParameters>
<asp:ControlParameter ControlID="CategoriesDropDown" DefaultValue="0" Name="CategoryID"
PropertyName="SelectedValue" Type="Int32" />
</SelectParameters>
</asp:ObjectDataSource>
<table border="1" width="100%" >
<thead>
<tr>
<td align="center" colspan="4">Available templates</td>
</tr>
<tr>
<td width="25%">Name</td>
<td width="70%">Description</td>
</tr>
</thead>
<tbody>
<asp:Repeater ID="TemplatesRepeater" runat="server"
DataSourceID="TemplatesDataSource" OnItemCommand="TemplatesRepeater_ItemCommand" >
<ItemTemplate>
<tr>
<asp:MultiView ID="ItemMultiView" runat="server" ActiveViewIndex="0">
<asp:View ID="ReadOnlyView" runat = "server">
<td>
<asp:Label ID="NameLabel" runat="server"
Text= '<%# Eval("TemplateName") %>' />
</td>
<td>
<asp:Label ID="DescriptionLabel" runat="server"
Text = '<%# Eval("Description") %>' />
</td>
<td>
<asp:Button ID="EditButton" runat ="server"
CommandName="edit" Text="Edit" />
</td>
<td>
<asp:Button ID="DeleteButton" runat = "server" UseSubmitBehavior="false"
CommandName = "delete" Text= "Delete"
CommandArgument = '<%# Eval("TemplateID") %>' />
<ajaxToolkit:ConfirmButtonExtender ID ="ConfirmButton" runat="server"
ConfirmText = "You are about to delete this template. Click ok to proceed"
TargetControlID = "DeleteButton" />
</td>
</asp:View>
<asp:View ID="EditView" runat="server">
<td>
<asp:TextBox ID="NameTextBox" runat ="server"
Text= '<%# Eval("TemplateName") %>' />
</td>
<td>
<asp:TextBox ID="DescriptionTextBox" runat="server"
Text = '<%# Eval("Description") %>' />
</td>
<td>
<asp:Button ID = "SaveButton" runat = "server"
CommandName= "save" Text = "Save"
CommandArgument = '<%# Eval("TemplateID") %>' />
</td>
<td>
<asp:Button ID = "CancelButton" runat = "server"
CommandName = "cancel" Text = "Cancel" />
</td>
</asp:View>
</asp:MultiView>
</tr>
</ItemTemplate>
<FooterTemplate>
<td>
<asp:TextBox ID="NameTextBox" runat ="server"
Text= '<%# Eval("TemplateName") %>' />
</td>
<td>
<asp:TextBox ID="DescriptionTextBox" runat="server"
Text = '<%# Eval("Description") %>' />
</td>
<td>
<asp:Button ID = "AddButton" runat = "server"
CommandName= "add" Text = "Add" />
</td>
</FooterTemplate>
</asp:Repeater>
</tbody>
</table>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="CategoriesDropDown" EventName="SelectedIndexChanged" />
</Triggers>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>
And a fraction of code behind:
protected void TemplatesRepeater_ItemCommand(object source, RepeaterCommandEventArgs e)
{
if (e.CommandName == "edit")
EditItem(e);
else if (e.CommandName == "cancel")
CancelItem(e);
else if (e.CommandName == "save")
SaveItem(e);
else if (e.CommandName == "delete")
DeleteItem(e);
else if (e.CommandName == "add")
AddItem(e);
}
private void DeleteItem(RepeaterCommandEventArgs e)
{
int TemplateID = int.Parse((string) e.CommandArgument);
DataLayer.ProtocolTemplate.DeleteTemplate(TemplateID);
this.TemplatesRepeater.DataBind();
}
I have removed the update panel, but still does not work.
The first time the page is rendered (HTTP GET) no AjaxControlToolkit.ConfirmButtonBehavior are created.
When you click on the delete button a regular postback occurs, the row is deleted and I get the following error on a browser alert:
Line: 1960
Error: Sys.ArgumentException:Value must not be null for Controls and Behaviors
Parameter name:element
The page source code contains the following javascript code:
Sys.Application.add_init(function() {
$create(AjaxControlToolkit.ConfirmButtonBehavior, {"ConfirmText":"You are about to delete this template. Click ok to proceed","id":"ConfirmButton"}, null, null, $get('DeleteButton'));
});
Sys.Application.add_init(function() {
$create(AjaxControlToolkit.ConfirmButtonBehavior, {"ConfirmText":"You are about to delete this template. Click ok to proceed","id":"TemplatesRepeater_ctl00_ConfirmButton"}, null, null, $get('TemplatesRepeater_ctl00_DeleteButton'));
});
Sys.Application.add_init(function() {
$create(AjaxControlToolkit.ConfirmButtonBehavior, {"ConfirmText":"You are about to delete this template. Click ok to proceed","id":"TemplatesRepeater_ctl01_ConfirmButton"}, null, null, $get('TemplatesRepeater_ctl01_DeleteButton'));
});
Obviously the first $create call fails because $get('DeleteButton') returns null since 'DeleteButton' does not exist.
If you continue clicking delete buttons you continue getting these errors, no confirmation alert message is shown.
Confirm button is the simplest control in Ajax Control Toolkit. I think at least this one should work :-(
I'm getting the exact same thing, except I am using a DataList instead of a Repeater.
I have decided not to use confirm button, instead I'm using the following:
<script type="text/javascript"> function ConfirmDelete(e) { if (!window.confirm("You are about to delete this categorie.\nClick OK to proceed, cancel otherwise")) { e.returnValue = false; if (e.preventDefault) e.preventDefault(); return false; } } </script> <asp:ImageButton ID="DeleteButton" runat ="server"ImageUrl ="Images/delete.png" Height="16px" Width="16px"
CommandName ="delete" ToolTip="Delete"
CommandArgument ='<%# Eval("HospitalID")%>'
OnClientClick="ConfirmDelete(event);"
/>
Did this issue get resolved? I'm also finding that my ConfirmButton control is not in an Update panel.
Please try your scenario with the recently available10301 release of the Toolkit (andASP.NET AJAX 1.0). If the problem persists, then please reply with acomplete, simple, self-contained sample page that demonstrates the problem so that we can investigate the specific behavior you're seeing. Thank you!
No comments:
Post a Comment