UpdatePanel does not work when AjaxControlToolkit lib is included - asp.net

I work on a simple ASP Webform project (asp framework 4.0), and use VS 2010.
I have a some pages on my website where I want to use UpdatePanels.
On another page of my website, i need to use ModalPopupExtender control wich is included in the AjaxControlToolkit lib.
The problem that i encountered is that my UpdatePanels do not work at all if I include the AjaxControlToolkit library in my project (no need to implement any component of this library, just adding a reference to it in my project).
If I remove the reference to the lib, it works fine.
Do you have an idea on how to concile those both elements ? UpdatePanel and AjaxControlToolkit lib ?
Thanks a lot for your advice
Here is the simple UpdatePanel code I use:
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:Repeater ID="Repeater1" runat="server" OnItemCommand="Repeater1_ItemCommand" OnItemDataBound="Repeater1_ItemDataBound">
<ItemTemplate>
<asp:LinkButton ID="lnk" runat="server" Text="show" CommandName="show"></asp:LinkButton>
</ItemTemplate>
</asp:Repeater>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Label runat="server" ID="label1"></asp:Label>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Repeater1" EventName="ItemCommand" />
</Triggers>
</asp:UpdatePanel>
In code behind, I use this :
protected void Page_Load(object sender, EventArgs e)
{
Repeater1.DataSource = new List<String>(){"zero", "un", "deux", "trois","quatre"};
Repeater1.DataBind();
}
protected void Repeater1_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
LinkButton lnk = ((LinkButton)e.Item.FindControl("lnk"));
lnk.CommandArgument = e.Item.ItemIndex.ToString();
}
protected void Repeater1_ItemCommand(object source, RepeaterCommandEventArgs e)
{
if (e.CommandName == "show")
label1.Text = "You click" + e.CommandArgument;
}

I found this post because i was the same problem when added a reference for AjaxToolKit.dll,
then was looking what could be the problem then found this with the comment to see the javascript errors and was the solution :D
I had in my code a script to get the start of the refresh
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_beginRequest(BeginRequestHandler);
prm.add_endRequest(EndRequestHandler);
function BeginRequestHandler(sender, args)
{
var elementID = sender._activeElement.id;
...
}
was getting "TypeError: sender._activeElement is undefined"
then changed the
var elementID = sender._activeElement.id;
to
var elementID = sender._postBackSettings.sourceElement.id;
and solved my problem.
Without the reference to the dll was working fine and when I remove it.
With the reference I had to change the properties of the element.

Related

Updatepanel in ascx refreshing the whole control

I've got a sitecore proejct, in which I have prepared a sub-layout in the form of an ascx User Control. I need to set up cascading drop downs in this user control, and based on what I found an UpdatePanel is the way to go. The problem is that the UpdatePanel seems to be refreshing the whole control, which I don't think is the correct behaviour.
I understand there are some similar questions on SO, but none of the solutions worked for me. I'm also beginning to suspect that this may be a Sitecore specific issue.
Here is a code sample of the user control:
<p><%= MyItem.Text %>" /></p>
<asp:UpdatePanel ID="LocationFilterUpdatePanel" runat="server">
<ContentTemplate>
<asp:DropDownList ID="DDL1" OnSelectedIndexChanged="DDL1_SelectedIndexChanged" runat="server" AutoPostBack="true">
</asp:DropDownList>
<asp:DropDownList ID="DDL2" OnSelectedIndexChanged="DDL2_SelectedIndexChanged" runat="server" AutoPostBack="true">
</asp:DropDownList>
</ContentTemplate>
</asp:UpdatePanel>
And the Code Behind:
protected void Page_Load(object sender, EventArgs e)
{
if (!System.Web.UI.ScriptManager.GetCurrent(Page).IsInAsyncPostBack)
{
var context = new SitecoreContext();
//Get Model from Sitecore
DDL1.DataSource = Model.Data;
DDL1.DataValueField = "Id";
DDL1.DataTextField = "Name";
DDL1.DataBind();
}
}
protected void DDL1_SelectedIndexChanged(object sender, EventArgs e)
{
var context = new SitecoreContext();
//Get Model from Sitecore
DDL2.DataSource = Model.Data;
DDL2.DataValueField = "Id";
DDL2.DataTextField = "Name";
DDL2.DataBind();
}
protected void DDL2_SelectedIndexChanged(object sender, EventArgs e)
{
}
The page loads fine, but (when debugging) changing the DDL1's index it will show a Null exception in MyItem.Text. This is outside the control panel. Note: I have also added a script manager.
There are plenty of things I've tried. Setting different update modes, updated the AjaxToolkit in my solution by executing Install-Package AjaxControlToolkit from the Package Manager Console... but the behaviour remains the same.
Thank you.
Put the databinding for DDL1 to the OnInit, rather than the Page_Load.
And don't include the if statement in there, just do the databind.
After the OnInit the selected values will be correctly set and you will be able to access the DDL1's options in the other event handlers.
You have asp:DropDownList control with an AutoPostBack set to true.
Remove the AutoPostBack=true from the Dropdownlist control and set an Async trigger for your UpdatePanel, set to the Dropdownlist and its eventname="SelectedIndexChanged"
This is a know issue, and you find a lot of documentation about it.

ASP.Net AJAX UpdatePanel not working with Repeater and RadioButtons

I have a repeater which includes a radio button in each item, and the whole thing sites inside an update panel. When I select a radio button the whole page reloads. Why is it not just updating the update panel. I've reduced this to a pretty simple example to avoid clutter. Code here...
ASPX...
<asp:ScriptManager ID="SM1" runat="server" />
<asp:UpdatePanel ID="up1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Repeater runat="server" ID="history">
<ItemTemplate>
<asp:RadioButton runat="server" ID="radioButton" AutoPostBack="true" GroupName="HistoryGroup" OnCheckedChanged="RadioButton_CheckChanged" /><br />
</ItemTemplate>
</asp:Repeater>
<p><asp:Literal runat="server" ID="output" /></p>
</ContentTemplate>
</asp:UpdatePanel>
Code...
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
List<int> list = new List<int>();
for (int i = 0; i < 20; i++)
list.Add(i);
history.DataSource = list.ToArray();
history.DataBind();
}
}
protected void RadioButton_CheckChanged(Object sender, EventArgs e)
{
output.Text = DateTime.Now.ToString();
}
}
Setting ClientIDMode=Auto on the RadioButton should fix it (it's an infamous .NET bug, http://connect.microsoft.com/VisualStudio/feedback/details/584991/clientidmode-static-in-updatepanel-fails-to-do-async-postback)
please add up1.Update() after output.Text = DateTime.Now.ToString(). Your RadioButton is not the trigger for updatepanel
Turns out the solution was to remove the GroupName from the RadioButton. When I remove this tag it fires asynchronously and just updates the panel. I don't actually need this tag anyway (due to the known bug where GroupName doesn't work on RadioButtons in Repeaters) as I handle the grouping within my click event (i.e. uncheck any other RadioButtons of the same name in other repeater items).

Can I put a Timer in Ajax updatePannel in a masterpage?

I made a very simple pannel updating wich will query a database and show a message on masterpage through a label.
Thus, I've put an updatePannel with a label and a timer within (obviously with a scriptManager) in my site's masterpage.
However, when I try to interact with the timer1 object, I receive an error message: "object not set to an instance of an object". I not receive this message when placing the schema in a blank page (without masterpage).
I must to run the query in masterpage because the users need to receive information whatever they are in my site.
How can I correctly place the components to do this work? what I'm doing wrong?
Thanks!
I just tried it within a master page without a problem. Here is the relevant code:
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" />
<asp:UpdatePanel ID="updMessage" runat="server">
<ContentTemplate>
<asp:Label ID="lblMessage" runat="server" />
<asp:Timer ID="tmrMessage" Interval="5000" ontick="tmrMessage_Tick" runat="server" />
</ContentTemplate>
</asp:UpdatePanel>
From master page code-behind:
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
Session["Message"] = 1;
}
}
protected void tmrMessage_Tick(object sender, EventArgs e)
{
int message = (int)Session["Message"];
lblMessage.Text = message.ToString();
Session["Message"] = ++message;
}
The problem was where I was putting the panel, label and timer. I put in contentPlaceHolder, where the problem occours. Now I put the control in the form tag, then the problem is solved.

How to update a control outside of an updatepanel?

I am going to show some text in a TextBox, which is located outside of an updatepanel, after checking a CheckBox but I cannot make it work. please help me out ?
Here is my code:
<asp:UpdatePanel runat="server" ID="uplMaster">
<ContentTemplate>
<asp:CheckBox ID="cbShowText" runat="server" Text="Show Some Text" AutoPostBack="true"
OnCheckedChanged="cbShowText_CheckedChanged" />
</ContentTemplate>
</asp:UpdatePanel>
<asp:TextBox ID="txtBox" Text="Empty" runat="server" />
Code Behind:
protected void cbShowText_CheckedChanged(object sender, EventArgs e)
{
txtBox.Text = "Some Text";
}
Thanks in advance :D
P.S. As you might have guessed, I have resembled my problem and that is why I don't want to put the TextBox in the UpdatePanel
I put the TextBox in another UpdatePanel and then called the Update method:
Here is my new code:
<asp:UpdatePanel runat="server" ID="uplMaster" UpdateMode="Always">
<ContentTemplate>
<asp:CheckBox ID="cbShowText" runat="server" Text="Show Some Text" AutoPostBack="true"
OnCheckedChanged="cbShowText_CheckedChanged" />
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel runat="server" ID="uplDetail" UpdateMode="Conditional">
<ContentTemplate>
<asp:TextBox ID="txtBox" Text="Empty" runat="server" />
</ContentTemplate>
</asp:UpdatePanel>
Code Behind:
protected void cbShowText_CheckedChanged(object sender, EventArgs e)
{
txtBox.Text = "Some Text";
uplDetail.Update();
}
Hope this helps
The textbox has to be in update panel also.
*Edit:
I am sorry I didn't read your question properly. Perhaps write a javascript function, and call the function from codebehind?
I know its been a while since this was asked, but here is what I did. Like #bla said write a javascript function and call it from code behind.
So in your checked changed call this. The changeText is a javascript function on your page in the header or in a script file.
protected void cbShowText_CheckedChanged(object sender, EventArgs e)
{
ScriptManager.RegisterStartupScript(this, GetType(), "Show Different Text", "changeText();", true);
}
Sample Javascript. Just gets called when checked changed event fires from code behind.
<script type="text/javascript">
function changeText() {
var txt= document.getElementById('<%= txtBox.ClientID %>');
var chk = document.getElementById('<%= cbShowText.ClientID %>');
if (chk.checked === true) {
txt.Text = "Something";
} else {
txt.Text = "Somethingelse";
}
}
</script>
Hope this helps someone.

UpdatePanel wrapped around a user control

I have a user control which contains some buttons and a placeholder. Those buttons cause controls to be added/removed from placeholder. Everything works fine.
Now I want to put this user control in a page, and wrap it in an updatepanel like so:
<asp:UpdatePanel ChildrenAsTriggers="true" ID="UpdatePanelFoo" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<grid:tablegrid ID="tablegrid_chapters" runat="server" SomeProperty="bar" />
</ContentTemplate>
</asp:UpdatePanel>
When I run the page, it's still doing a full postback when I hit one of the buttons inside the user control. What am I doing wrong, and how can I remedy this?
Update:
protected void Page_Init()
{
ScriptManager scr = ScriptManager.GetCurrent(this.Page);
Response.Write("EnablePartialRendering: " + scr.EnablePartialRendering);
}
Outputs "EnablePartialRendering: true"
Make sure you have EnablePartialRendering=true on your ScriptManager in the page.
Update
It looks like your UserControl has no events to be looking for...you have 2 options here. Move the UpdatePanel inside the UserControl .ascx so it can see the button events as children to rig up or add an event for it to see, to do that try something like this:
public event EventHandler Click;
void btn_del_Click(object sender, EventArgs e)
{
if (NumberOfRowControls > 0)
{
var rowToWhack = panel_rows.Controls.Children().Single(x => x.ID == "myrow" + (NumberOfRowControls - 1));
panel_rows.Controls.Remove(rowToWhack);
NumberOfRowControls--;
}
if(Click != null) Click(this, e);
}
void btn_add_Click(object sender, EventArgs e)
{
var row = NewRow(NumberOfRowControls);
panel_rows.Controls.Add(row);
if(Click != null) Click(this, e);
}
And update the UpdatePanel to be looking for it:
<asp:UpdatePanel ID="UpdatePanelFoo" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<grid:tablegrid ID="tablegrid_chapters" runat="server" SomeProperty="bar" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="tablegrid_chapters" EventName="Click">
</Triggers>
</asp:UpdatePanel>
Make sure you add a ScriptManager as well to the page, otherwise there's no UpdatePanel functionality.

Resources