Control Focus in ASP.Net 2.0 using AJAX, Master Pages, user controls...

Having a heck of a time with this... Any assistance would be appreciated. All I need to do is set focus to a textbox control that is inside an AJAX tab container (has 2 tabs) that is inside a user control that is inside the content page of a master page. I've tried everything from setting the default focus in the master page to calling .focus() on the textbox to custom javascript and cant get anything to work. Is there something I'm missing here? I'd like to somehow set the focus at the content page level if possible.

Thanks,Troy

I usually set the focus by custom javascript and not use any asp.net built-in feature for this.

I use this javascript function:

function setFocus( id )
{
var o = document.getElementById( id );
if(o != null && !o.disabled ) { o.focus(); }
}

And I have this just before closing the body tag, but can be other place:

<script type="text/javascript">

setFocus( "yourcontrolid" );

</script>

The real question is how to get the corrent id for your control?

You can do this for example:

setFocus( '<%= yourcontrol.ClientID %>' );

You can also hard-code the control id, you can find-out your correct control id by examining the source view of your html page (if the control is rendered during an async postback the page source view not reflect the changes, you need some debugging tool to see your real html source, firebug etc.)

Hadn't thought of inline script. I tried the above, but am still getting the following error: guessing it's an AJAX tab container thing:

"htmlfile: Can't move focus to the control because it is invisible, not enabled, or of a type that does not accept the focus."

Here's what I did: Exposed the textbox's clientID in a string property from the child control; Added setFocus(id) sccript to the master page's head tag;At the end of the content page's Page_Load event (server), added aRegisterStartupScript for setFocus passing in the clientID property.

When debugging the above error, my textbox (Input element) makes it into the setFocus() function, is enabled, etc, etc, ... ??

I'll continue to search on the above error. Thanks for the input stmarti...

Found a workaround. (seehttp://forums.asp.net/t/1184754.aspx?PageIndex=3) I ran across this before but am using it as a last resort... "Slowing down" the app doesnt seem like the correct solution but will have to do. I worked a delay routine into the setFocus() solution stmarti suggested. Did the same as above with the following changes in the master page (and calling delay using RegisterStartupScript in content's page_load instead of setFocus):

function delay(id){setTimeout("setFocus('"+id+"')",500);

}

function setFocus( id ) {

var o = document.getElementById( id );if(o !=null && !o.disabled ) { o.focus(); }

}

Anyone with a more elegant solution, please post. Thanks!

What about this (no delay required I think)?

<script type="text/javascript"
Sys.Application.add_load( function( )
{

var o = document.getElementById( yourid );

if(o !=null && !o.disabled ) { o.focus(); }

} );

</script>

You can try other events also (ASP.NET AJAX > Overview > ASP.NET AJAX Client Life-Cycle Events )

Looks like the above is what I'm looking for - wont get a chance to investigate for a bit. Thanks!

Content Place Holder containing accordion control

Hi

I'm new'ish to ASP (AJAX) and was trying to create a web site. Most has gone fine but I have a Master page with a content Place Holder on it.

I tried to put an accordion control on (between content tags) and it told me I needed a Script Manager which I did put on. Even with no other controls / code I get errors about 'sys' is undefined from IE with line numbers etc.

It seems to be from the following lines in source

//<![CDATA[
Sys.WebForms.PageRequestManager._initialize('ctl00$ContentPlaceHolder1$ScriptManager1', document.getElementById('aspnetForm'));
Sys.WebForms.PageRequestManager.getInstance()._updateControls([], [], [], 90);
//]]>

Has anyone managed to get Accordion working with Content Place Holder and if so what am I doing wrong. I can get it workig with just a default.aspx type page.

thanks

Trev

The sample website uses a master page. So the accordiondemo shows the usage of the control inside a content placeholder. Check it out the accordion.aspx demo page code for more details. You can download the code for the toolkit which includes the sample website from thecodeplex site.

Thanks

I rebuilt the default.aspx file and it seemed to cure the problem. Now I just have the problem of Contant place holder not sizing correctly

thanks again

Content Page Works, Master Page does not

I have a strange problem with Master Pages and Atlas. I have gone through several posts on this forum and I gathered that people were/are having problems with getting their UpdatePanels to work in the content pages. My problem is actually different and strange. My Atlas stuff works. It is my non-atlas stuff that stops working.

Here's some pseudo code (obvious code omitted for clarity)

Here's the Master

... html header stuff omitted

<body> <form id="form1" runat="server"> <atlas:ScriptManager ID="ScriptManager1" EnablePartialRendering="true" runat="server" /> <div> <pc:PortalHeader id="PortalHeader1" runat="server"> </pc:PortalHeader> <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"> </asp:ContentPlaceHolder> </div> </form></body>

Here's the Content page

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"> <div> <atlas:UpdatePanel ID="UpdatePanel1" runat="server" Mode="conditional"> <ContentTemplate> <asp:GridView ID="SamplingThresholdsGridView" runat="server" AutoGenerateColumns="False" AutoGenerateEditButton="True" DataKeyNames="Id,SamplingName" DataSourceID="SamplingThresholdsDataSource" Style="z-index: 100; left: 20px; position: relative" CssClass="Grid" AlternatingRowStyle-CssClass="GridOddRow" Width="686px"> <Columns> <asp:BoundField DataField="Id" HeaderText="Id" SortExpression="Id" Visible="False" /> <asp:BoundField DataField="SamplingName" HeaderText="Sampling Name" ReadOnly="True" SortExpression="SamplingName" /> <asp:BoundField DataField="SamplingValue" HeaderText="Sampling Value" SortExpression="SamplingValue" /> <asp:BoundField DataField="UpdateBy" HeaderText="Updated By" ReadOnly="True" SortExpression="UpdatedBy" /> <asp:BoundField DataField="UpdateDt" HeaderText="Updated Dt" ReadOnly="True" SortExpression="UpdatedDt" /> </Columns> <AlternatingRowStyle CssClass="GridOddRow" /> </asp:GridView> </ContentTemplate> </atlas:UpdatePanel> </div>

... data source omitted
</asp:Content>
 
Notice that my Master has a header served by a user control "PortalHeader". That's why I have Master Pages for in the first place. Needless to say, my content page refers to the
Master page (not shown). Everything was working fine. My script manager was in my "old" plain page. Then I created a master page and my "old" plain page became my Content
Page. I moved the script manager to the master page based on a lot of posts on this forum. Not that it makes a difference where I put it. Things "work", but not as I want them to be.
 
When I hit "Edit" on my data grid, the "header" served by PortalHeader in my master page dissappears !!! Other than that, the UpdatePanel works perfectly. I never get the header
unless I reload the page. It does not matter whether I "Update" or "Cancel" my "Edit". When I view the html source in the browser, every time I see my header HTML, but it stops
getting rendered.
 
In conclusion, UpdatePanel is working as expected EXCEPT that my Master Page is broke. I simply remove the UpdatePanel/ContentPane tags around my grid view and my header
is back! But then I cannot use Ajax!.
 
I'm at the point where I'm thinking of putting my "PortalHeader" control in each content page. But then I don't need Master Pages at all.
 
Help !!!

Hard to tell without seeing all the code. But, how about just putting an UpdatePanel around the PortalHeader control? I could imagine a scenario where the default visibility of a DOM element that the PortalHeader is rendered to is "hidden" by default but is set to "visible" by some other page control on page load but not during asynchronous postbacks (postback from an UpdatePanel). So check the style of the PortalHeader. Are there UpdatePanels inside the PortalHeader?

Content Page based on master page accordion pain

Hey all,

I have a content page that is based on a master page. I am trying to use an accordion control on it and am getting no where.

If I cut and paste the accordion code from my master page derived content page and put it in a NON-master page derived page. It works great.

What am I missing? By the way, I am not using a script proxy because I don't have a script manager on the master page. Don't know if that matters, but ... Below is the code.

Thanks ... Ed

<%@dotnet.itags.org.PageLanguage="VB"MasterPageFile="~/MasterPage.master"AutoEventWireup="false"CodeFile="ExpenseSpreader.aspx.vb"Inherits="Admin_ExpenseSpreader"title="Envision Accounting - Expense Spreader" %>

<asp:ContentID="Content1"ContentPlaceHolderID="ContentPlaceHolderContent"Runat="Server">

<asp:ScriptManagerid="ScriptManager1"runat="server">

</asp:ScriptManager>

<div>

<ajaxToolkit:Accordionid="Accordion1"runat="server"FadeTransitions=TrueSelectedIndex=0

HeaderCssClass="accordionHeader"ContentCssClass="accordionContent"AutoSize=none>

<Panes>

<ajaxToolkit:AccordionPaneID="AccordionPane1"runat="server"ContentCssClass=""HeaderCssClass="">

<Header>

<ahref=""onclick="return false;"class="accordionLink">Professional Expenses</a>

</Header>

<Content>

This is Professional Expenses

</Content>

</ajaxToolkit:AccordionPane>

<ajaxToolkit:AccordionPaneID="AccordionPane2"runat="server"ContentCssClass=""HeaderCssClass="">

<Header>

<ahref=""onclick="return false;"class="accordionLink">Other Expenses</a>

</Header>

<Content>

This is Other Expenses

</Content>

</ajaxToolkit:AccordionPane>

</Panes>

</ajaxToolkit:Accordion>

</div>

</asp:Content>

More information. I was able to isolate the problems to the fact that there's a master page involved. If I take the simplest masterpage and add a content page with nothing but the simplest accordion with 2 panes, it does not work properly. If I take it off the master page and just have html, it works great.

Here is the code for both.

First as html which works, then the content page and master page which doesn't. There is no code behind code in any case.

Thanks ... Ed

<%@.PageLanguage="VB"AutoEventWireup="false"CodeFile="ExpenseSpreader.aspx.vb"Inherits="Admin_ExpenseSpreader" %>

<!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<htmlxmlns="http://www.w3.org/1999/xhtml">

<headid="Head1"runat="server">

<title>Untitled Page</title>

</head>

<body>

<formid="form1"runat="server">

<div>

<asp:ScriptManagerid="ScriptManager1"runat="server">

</asp:ScriptManager>

<ajaxToolkit:AccordionID="Accordion1"runat="server"FadeTransitions="false"FramesPerSecond="40"TransitionDuration="250"AutoSize="None">

<Panes>

<ajaxToolkit:AccordionPaneID="p1"runat=server>

<Header>

<ahref=""onclick="return false;">Pane1</a>

</Header>

<Content>

Content 1

</Content>

</ajaxToolkit:AccordionPane>

<ajaxToolkit:AccordionPaneID="p2"runat=server>

<Header>

<ahref=""onclick="return false;">Pane 2</a>

</Header>

<Content>

Content 2

</Content>

</ajaxToolkit:AccordionPane>

</Panes>

</ajaxToolkit:Accordion>

</div>

</form>

</body>

</html>

////////////////////////////

Here it is as a content page

<%@.PageLanguage="VB"MasterPageFile="~/MasterPage.master"AutoEventWireup="false"CodeFile="ExpenseSpreader.aspx.vb"Inherits="Admin_ExpenseSpreader" %>

<asp:ContentID="Content1"ContentPlaceHolderID="ContentPlaceHolderContent"Runat="Server">

<asp:ScriptManagerid="ScriptManager1"runat="server">

</asp:ScriptManager>

<ajaxToolkit:AccordionID="Accordion1"runat="server"FadeTransitions="false"FramesPerSecond="40"TransitionDuration="250"AutoSize="None">

<Panes>

<ajaxToolkit:AccordionPaneID="p1"runat=server>

<Header>

<ahref=""onclick="return false;">Pane1</a>

</Header>

<Content>

Content 1

</Content>

</ajaxToolkit:AccordionPane>

<ajaxToolkit:AccordionPaneID="p2"runat=server>

<Header>

<ahref=""onclick="return false;">Pane 2</a>

</Header>

<Content>

Content 2

</Content>

</ajaxToolkit:AccordionPane>

</Panes>

</ajaxToolkit:Accordion>

</asp:Content>

/////////////////////////

Here is the master page.

<%@.MasterLanguage="VB"CodeFile="MasterPage.master.vb"Inherits="MasterPage" %>

<!DOCTYPEHTMLPUBLIC"-//W3C//DTD HTML 4.0 Strict//EN">

<htmlxmlns="http://www.w3.org/1999/xhtml">

<headid="Head1"runat="server">

<title>Envision Accounting</title>

<metaname="vs_defaultClientScript"content="JavaScript">

<metaname="vs_targetSchema"content="http://schemas.microsoft.com/intellisense/ie5">

</head>

<bodyid="MasterBody"runat=serverstyle="margin:0; top:0;">

<formid="form1"runat="server">

<divclass="content">

<asp:ContentPlaceHolderID="ContentPlaceHolderContent"runat="server">

</asp:ContentPlaceHolder>

</div>

</form>

</body>

</html>