Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Chriss Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

SmartNavigation AutoPostBack Focus

Status
Not open for further replies.

cappmgr

Programmer
Jan 29, 2003
639
US
I have been given a task to make the TextBox they tab or click to have focus. When I got it the page was using SmartNavigation="True" and the enterable TextBoxes have AutoPostBack="True" by design the focus is returned to the TextBox that had focus regardless of where you tried to tab or click to see
The AutoPostBack is needed because a label is updated for every TextBox. The user may enter a different value in the next TextBox depending on the value of the previous Label that was updated.

What I did was turn SmartNavigation="False" and put a little javascript to set a hidden field to the next TextBox with onfocus. Then when the page reloads another piece of javascript set focus to the next TextBox. This works fine if you are tabbing sequentially through the TextBoxes. It does not work when hitting shift tab (going backwards) or clicking on the third TextBox after entering data in the first TextBox.
Any ideas greatly appreciated.
Marty
 
Here is a solution and the proof of concept.
aspx
Code:
<%@ Page Language="vb" AutoEventWireup="false" Codebehind="SmartNavagationAutoPostback.aspx.vb" Inherits="SmartNavagationAutoPostback"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
	<HEAD>
		<title>SmartNavagationAutoPostback</title>
		<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
		<meta content="Visual Basic .NET 7.1" name="CODE_LANGUAGE">
		<meta content="JavaScript" name="vs_defaultClientScript">
		<meta content="[URL unfurl="true"]http://schemas.microsoft.com/intellisense/ie5"[/URL] name="vs_targetSchema">
		<SCRIPT language="JavaScript">
<!--
function SetNextFocus(controlToGetFocus) 
{
	//this is to set the next control that is to get focus on postback
	if (document.forms('Form1').NextBoxToGetFocus.value == controlToGetFocus) 
	{
		event.cancelBubble = true;
        event.returnValue = false;
	}
	else
	{
		document.forms('Form1').NextBoxToGetFocus.value = controlToGetFocus;
		event.returnValue = true;
		document.Form1.submit();
	}
}
function setFocus(formId, elementId) 
{
    var o = document.forms[formId].elements[elementId];
    if (o != null)
        o.focus();
}

//-->
		</SCRIPT>
		<style>.hide { DISPLAY: none }
		</style>
	</HEAD>
	<body MS_POSITIONING="GridLayout">
		<form id="Form1" method="post" runat="server">
			<asp:textbox id="TextBox1" onfocus="SetNextFocus('TextBox1');" runat="server"></asp:textbox><asp:label id="Label1" runat="server">Label1</asp:label><br>
			<br>
			<asp:textbox id="TextBox2" onfocus="SetNextFocus('TextBox2');" runat="server"></asp:textbox><asp:label id="Label2" runat="server">Label2</asp:label><br>
			<br>
			<asp:textbox id="TextBox3" onfocus="SetNextFocus('TextBox3');" runat="server"></asp:textbox><asp:label id="Label3" runat="server">Label3</asp:label><br>
			<br>
			<asp:textbox id="TextBox4" onfocus="SetNextFocus('TextBox4');" runat="server"></asp:textbox><asp:label id="Label4" runat="server">Label4</asp:label><br>
			<div class="hide">
				<asp:TextBox ID="NextBoxToGetFocus" runat="server"></asp:TextBox>
			</div>
			<asp:Button ID="Button1" Runat="server" Text="Button1"></asp:Button>
			<br>
			<br>
			<asp:Label id="Label5" runat="server">Label5</asp:Label></form>
	</body>
</HTML>
aspx.vb
Code:
'''This is a proof of concept. The goal was to emulate AutoPostBack and 
'''SmartNavigation with the exception that the TextBox that is clicked next will
'''get focus after PostBack. 
Public Class SmartNavagationAutoPostback
    Inherits System.Web.UI.Page
#Region " Web Form Designer Generated Code "

    'This call is required by the Web Form Designer.
    <System.Diagnostics.DebuggerStepThrough()> Private Sub InitializeComponent()

    End Sub
    Protected WithEvents TextBox1 As System.Web.UI.WebControls.TextBox
    Protected WithEvents Label1 As System.Web.UI.WebControls.Label
    Protected WithEvents TextBox2 As System.Web.UI.WebControls.TextBox
    Protected WithEvents Label2 As System.Web.UI.WebControls.Label
    Protected WithEvents TextBox3 As System.Web.UI.WebControls.TextBox
    Protected WithEvents Label3 As System.Web.UI.WebControls.Label
    Protected WithEvents TextBox4 As System.Web.UI.WebControls.TextBox
    Protected WithEvents Label4 As System.Web.UI.WebControls.Label
    Protected WithEvents NextBoxToGetFocus As System.Web.UI.WebControls.TextBox
    Protected WithEvents Button1 As System.Web.UI.WebControls.Button
    Protected WithEvents Label5 As System.Web.UI.WebControls.Label

    'NOTE: The following placeholder declaration is required by the Web Form Designer.
    'Do not delete or move it.
    Private designerPlaceholderDeclaration As System.Object

    Private Sub Page_Init(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Init
        'CODEGEN: This method call is required by the Web Form Designer
        'Do not modify it using the code editor.
        InitializeComponent()
    End Sub

#End Region

    Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        Page.SmartNavigation = False
        If Not Page.IsPostBack Then
            NextBoxToGetFocus.Text = "TextBox1"
            SetFocus("Form1", NextBoxToGetFocus.Text)
            Label5.Text = "Not Post Back"
        Else
            Label5.Text = "Post Back"
            If Not NextBoxToGetFocus.Text.Equals(String.Empty) Then
                SetFocus("Form1", NextBoxToGetFocus.Text)
            End If
        End If
    End Sub

    Public Sub TextBox1_TextChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles TextBox1.TextChanged
        Label1.Text = TextBox1.Text
    End Sub

    Private Sub TextBox2_TextChanged(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles TextBox2.TextChanged
        Label2.Text = TextBox2.Text
    End Sub

    Private Sub TextBox3_TextChanged(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles TextBox3.TextChanged
        Label3.Text = TextBox3.Text
    End Sub

    Private Sub TextBox4_TextChanged(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles TextBox4.TextChanged
        Label4.Text = TextBox4.Text
    End Sub
    Protected Sub SetFocus(ByVal formName As String, ByVal elementName As String)
        ' Define the JavaScript function for the specified control.
        Dim focusScript As String = "<script language='javascript'> setFocus('" & formName & "', '" & elementName & "'); </script>"
        ' Add the JavaScript code to the page.
        If (Not Me.IsStartupScriptRegistered("FocusScript")) Then
            Me.RegisterStartupScript("FocusScript", focusScript)
        End If
    End Sub

    Private Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
        Label5.Text = "Post Pack and Button1 Clicked"
    End Sub
End Class
Marty
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top