Updating control in UserControl inside of UpdatePanel

Hello,

I have a page that contains a UserControl. Most of the page (including the UserControl) is wrapped in an UpdatePanel. When an AJAX event on the page occurs, I'd like to call a method inside of the UserControl to update a label. Problem is, when I do this, the page adds a new copy of the UserControl's contents (with the updated label) at the bottom of the page rather than refreshing the existing copy. Any idea what I'm doing wrong?

Thanks.

Are you dynamically creating the controls in the user control or dynamically creating the usercontrol itself? Posting your source code would be helpful.

Nope, no dynamic loading of anything. The page just looks something like this:

<asp:ScriptManagerrunat="server"ID="ScriptManager1"></asp:ScriptManager>

<asp:UpdatePanelID="UpdatePanel1"runat="server">

<ContentTemplate>

<Custom:HotelDetailsrunat="server"ID="HotelDetails1"/>

</ContentTemplate>

</asp:UpdatePanel>

And there's an event in the code-behind of the page:

ProtectedSub DateChanged(ByVal srcAsObject,ByVal eAs Infragistics.WebUI.WebSchedule.WebDateChooser.WebDateChooserEventArgs)

HotelDetails1.UpdateRooms(wdcCheckIn.Value, wdcCheckOut.Value)

EndSub

And in the UserControl, there's a public method like this:

PublicSub UpdateRooms(ByVal StartDateAs DateTime,ByVal EndDateAs DateTime)

litName.Text = StartDate.ToShortDateString()

EndSub

I split the page into two UpdatePanels...one for the even firing controls and one for the UserControls that get updated and that seems to resolve the issue.

Updating UpdatePanel contents from Popup

Welcome, can you help me solving that problem

I have a UserControl UserControl1 that contains Gridview gridview1 and input Button button1, An UpdatePanel contains UserControl1 in a page, when i press that button1 it opens a popup window which contains a input button popUpButton and a TextField, the pop up is used to add a new record to the datasource of gridview1, Then i rebind the updated datasource to gridview1, Hover the problem is the gridview1 don't render the new row added although it's datasource is updated ..!
Notes:

- I tried to use both modes of UpdatePanel (Always and Condtional) but no hope
- The UpdatePanel is in the page NOT in Usercontrol1
- There is one ScriptManager and two other update panels in same page
- I use .NET Callback interface methods When I press popUpButton IN THE popup control so that i can trigger serverside update datasource process from client side javascrip code

so how i can render that changes from datasource to gridview??

Hi

This link helps youRefresh GridView in Parent Page.

Regards.

Use "Hello World Using Client Script" in UserControl

Hi

I want to create a asp.net user control for dynamic date entering, and I'm trying to use the same approach as in the example:

 <form runat="server">
 <div>
 Search for
 <input id="SearchKey" type="text" />
 <input id="SearchButton" type="button"
 value="Search"
 onclick="DoSearch()" />
 </div>
 </form>
 <hr style="width: 300px" />
 <div>
 <span id="Results"></span>
 </div>
 <script type="text/javascript"
 function DoSearch()
 {
 var SrchElem = document.getElementById("SearchKey");
 Samples.AspNet.HelloWorldService.HelloWorld(SrchElem.value,
 OnRequestComplete);
 }
 function OnRequestComplete(result)
 {
 var RsltElem = document.getElementById("Results");
 RsltElem.innerHTML = result;
 }
 </script>

The problem is if I use <input id=SearchKey> -tag for the result, then there will be problems if I use the same control multiple times on one page (the id is not unique, and the OnRequestComplete will update every <input>-tag with id=SearchKey). If I change it to <input id=SearchKey runat=server>, asp will render unique id's for the <input>, but then .getElementById() does not find "object".

I have done a "workaround" where I passes the object's Id to the Webservice, and returns it in an array together with the result, but I don't think this is "a great way". Is there any other solution? A better one?

function DoSearch(CallerId)
{
var SrchElem = document.getElementById(CallerId);
Samples.AspNet.HelloWorldService.HelloWorld(this.id, SrchElem.value,
OnRequestComplete);
}

function OnRequestComplete(result)
{

var objectId = result[0].toString();
var WebServiceResult = result[1].toString();
var RsltElem = document.getElementById(objectId);
RsltElem.innerHTML = result;
}

Regards

Lars K.

This is a common problem... if you use ASP.NET server IDs you need to reference the client ID in client script:

var Ctl = $('<%= SearchKey.ClientID %>');

will do the trick in finding the control reliably.

You also need to use this if use MasterPages or any contained control, so as a general rule this is the best way to reference server based page variables.

+++ Rick --