Set focus in TextBox after postback

I have a simple page where I want to filter a ListBox based upon a value(s) in a textbox – both are in an UpdatePanel.
This works correctly, however, after the postback the textbox had lost focus…so I set focus back in the page_load.
Then I noticed that the cursor was now at the beginning of the text when I want it at the end so the user can carry on typing, so I added an onfocus(…) attribute to the textbox to set the value back to itself (see code below).

This works the first two times, but then it stops setting focus to the textbox?

Markup

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ListTest.aspx.cs" Inherits="SalesForceTest.ListTest" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server" LoadScriptsBeforeUI="true"/>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <asp:TextBox runat="server" ID="filter" AutoPostBack="true" onkeyup="__doPostBack(this.id, this.value)" onfocus="this.value = this.value;"  />
                <br />
                <asp:ListBox ID="AccountList" runat="server" Width="185px"></asp:ListBox>
            </ContentTemplate>
        </asp:UpdatePanel>
    </div>
    </form>
</body>
</html>

Codebehind

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Text;

namespace SalesForceTest
{
    public partial class ListTest : System.Web.UI.Page
    {
        List<string> allAccounts = new List<string> { "2342", "3434", "2332", "3224", "7899", "8797", "3435" };

        protected void Page_Load(object sender, EventArgs e)
        {
            AccountList.Items.Clear();
            allAccounts.Where(ac => ac.StartsWith(filter.Text)).ToList().ForEach(a => AccountList.Items.Add(a));

            if (Page.IsPostBack)
            {
                if (Request.Form["__EVENTTARGET"] == filter.ID)
                {
                    ScriptManager1.SetFocus(filter);
                }
            }
        }
    }
}

Any help VERY gratefully received 🙂

Contents hide

Answers:

Method 1

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

You need to set the cursor/caret position at the end of text using java-script. Use below js function for the setting cursor position:

function setCaretTo(obj, pos) { 
    if(obj.createTextRange) { 
        /* Create a TextRange, set the internal pointer to
           a specified position and show the cursor at this
           position
        */ 
        var range = obj.createTextRange(); 
        range.move("character", pos); 
        range.select(); 
    } else if(obj.selectionStart) { 
        /* Gecko is a little bit shorter on that. Simply
           focus the element and set the selection to a
           specified position
        */ 
        obj.focus(); 
        obj.setSelectionRange(pos, pos); 
    } 
}

source for above code: http://parentnode.org/javascript/working-with-the-cursor-position/

Now, what you need is ref to your client-side textbox object (document.getElementById) and text length (textbox.value.length). Call the function in the start-up script (registered via ScriptManager.RegisterStartupScript) method.

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes

Article Rating