How Do I Reset Scroll Position Inside UpdatePanel?

Hello,

I have a UserControl inside an UpdatePanel. The UserControl contains several DIVs that I show and hide through partial postback. I want the contents of each DIV to be scrolled to the top when I show it. I have tried using the ScriptManager to set focus onto the topmost control of each DIV when I show it, but it doesn't work. I have also tried through javascript to no avail. I know this is kind of the opposite of the behavior that many folks want from AJAX, but I need it for this piece of my application. I have tried searching but all examples are page-centric, not usercontrol-centric and speak to SmartNavigation.

Any help is appreciated.

Brendan

not sure if this would help, but I found something interestingin terms of firing off some js code during a partial page update :

http://ajax.asp.net/docs/ClientReference/Sys.WebForms/PageRequestManagerClass/default.aspx

It was particularly useful for displaying a message to the user to indicate something was happening...

Good luck,

Bob

I ended up just using this in the codebehind of the ascx:

ScriptManager.RegisterStartupScript(Page,typeof(PageTemplate),"Focus","focus();",true);

And including this function in a .js file (one line for each section):

function focus() {
try { window.location.href='#IA'; } catch (err) {}
try { window.location.href='#IB'; } catch (err) {}
try { window.location.href='#IC'; } catch (err) {}
try { window.location.href='#ID'; } catch (err) {}
try { window.location.href='#IIA'; } catch (err) {}
try { window.location.href='#IIB'; } catch (err) {}
try { window.location.href='#IIC'; } catch (err) {}
}

Seems to work on all but the initial page change, which is 'good enough' for me at this stage.

How do i abort Ajax TabContainer Tab Change?

I have a Ajax TabContainer that has 3 tabs and each of the tab contains a formview to display/update data. When the user modifies any data in the edit mode in the formview and tries to change tab without updating the data, i would like to display a warning message to alert the user that he/she has some unsaved data in the form and abort the tab change. I sort of have an idea how to do it but somehow it's giving me a runtime javascript object reference = null runtime error on sender.set_activeTabIndex(0); in tabChanged(). Can someone help please? Thanks.

Current Code:

<script type="text/javascript">

var isDirty = false;

var prevTabIndex = 0;

function tabChanged(sender, args)

{

if (isDirty)

{

sender.set_activeTabIndex(0);

prevTabIndex = parseInt(sender.get_activeTabIndex());

}

}

function setDirty(objID)

{

if (document.getElementById(objID).value != document.getElementById(objID).defaultValue)

{

//alert("Old Value: "+document.getElementById(objID).defaultValue+", New Value: "+document.getElementById(objID).value);

isDirty=true;

}

}

</script>

<cc1:TabContainerID="TabContainer1"runat="server"Width="818px"Height="260px"ActiveTabIndex="0"OnClientActiveTabChanged="tabChanged">

<cc1:TabPanelID="TabPanel1"runat="server"HeaderText="TabA">

<HeaderTemplate>TabA</HeaderTemplate>

<ContentTemplate>

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

<ContentTemplate>

<asp:FormViewID="fvA"runat="server"DefaultMode="readonly"DataSourceID="dsA"OnModeChanging="changeFormViewMode">

<ItemTemplate>

FieldA :<%# Eval("FieldA") %>

</ItemTemplate>

<EditItemTemplate>

FieldA:

<asp:TextBoxID="TextBoxA"runat="server"Text='<%# Bind("FieldA") %>'onchange="setDirty(this.id)"></asp:TextBox>

</EditItemTemplate>

</asp:FormView>

</ContentTemplate>

</asp:UpdatePanel>

</ContentTemplate>

</cc1:TabPanel>

<cc1:TabPanelID="TabPanel2"runat="server"HeaderText="TabB">

<HeaderTemplate>TabB</HeaderTemplate>

<ContentTemplate>

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

<ContentTemplate>

<asp:FormViewID="fvB"runat="server"DefaultMode="readonly"DataSourceID="dsB"OnModeChanging="changeFormViewMode">

<ItemTemplate>

FieldB :<%# Eval("FieldB") %>

</ItemTemplate>

<EditItemTemplate>

FieldB:

<asp:TextBoxID="TextBoxB"runat="server"Text='<%# Bind("FieldB") %>'onchange="setDirty(this.id)"></asp:TextBox>

</EditItemTemplate>

</asp:FormView>

</ContentTemplate>

</asp:UpdatePanel>

</ContentTemplate>

</cc1:TabPanel>

Hi Sazabi,

After a quick glance, I found that there maybe a endless loop in your code. When you change the actived Tab, it will raise OnClientActiveTabChanged event and there's set_activeTabIndex() in your code, then it will raise OnClientActiveTabChanged once more.

You should do some modification. For example:

var flag = false;
function tabChanged(sender, args){
if(flag) {flag = false; return;}
flag = true;
sender.set_activeTabIndex(0);
prevTabIndex = sender.get_activeTabIndex();
}

Best regards,

Jonathan