How to prevent the Focus() method from scrolling the page to the top

Question

I have set of textboxes in a gridview and I use the Focus() method to restore the focus after losing to the intended text box. The problem is :

The page (scrollable) and when I call the Focus method, in the text changed event, the page jump to the top. It's such a confusing behavior.

My question is:

Is there some way to prevent the Focus() method from jumping the page to the top?

My code:

protected void txt_evaluateWeights_TextChanged(object sender, EventArgs e)
        {

            calc();
            int index = ((System.Web.UI.WebControls.GridViewRow)(((RadTextBox)sender).Parent.NamingContainer)).DataItemIndex;

            ((RadTextBox)gv_Evaluation.Rows[index + 1].Cells[3].FindControl("txt_evaluateWeights")).Focus();//Here is the problem. 
        }

Note:

• I use the asp:TextBox, and the same problem.

• My grid view in an update panel

---

EDIT :

Javascript workaround:

var lastFocusedControlId = "";

function focusHandler(e) {
    document.activeElement = e.originalTarget;
}

function appInit() {
    if (typeof (window.addEventListener) !== "undefined") {
        window.addEventListener("focus", focusHandler, true);
    }
    Sys.WebForms.PageRequestManager.getInstance().add_pageLoading(pageLoadingHandler);
    Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(pageLoadedHandler);
}

function pageLoadingHandler(sender, args) {
    lastFocusedControlId = typeof (document.activeElement) === "undefined"
        ? "" : document.activeElement.id;
}

function focusControl(targetControl) {
    if (Sys.Browser.agent === Sys.Browser.InternetExplorer) {
        var focusTarget = targetControl;
        if (focusTarget && (typeof (focusTarget.contentEditable) !== "undefined")) {
            oldContentEditableSetting = focusTarget.contentEditable;
            focusTarget.contentEditable = false;
        }
        else {
            focusTarget = null;
        }
        try {
            targetControl.focus();
            if (focusTarget) {
                focusTarget.contentEditable = oldContentEditableSetting;
            }
        }
        catch (err) { }
    }
    else {
        targetControl.focus();
    }

}

function pageLoadedHandler(sender, args) {
    if (typeof (lastFocusedControlId) !== "undefined" && lastFocusedControlId != "") {
        var newFocused = $get(lastFocusedControlId);
        if (newFocused) {
            focusControl(newFocused);
        }
    }
}

Sys.Application.add_init(appInit);

Answer 1

Rather than trying to fix the way the Focus method behaves, there is an alternative. I haven't tried it, but this page has a discussion of the problem, and some client-side javascript to remember which control had the focus, and then put the focus back on that object after the UpdatePanel gets refreshed. Be sure to read the comment for some updates to the script.

If you use this method, you would remove the call to Focus on in your codebehind, and let this script deal with it on the client.

Answer 2

Provided that you're using update panels and jquery, the solution is quite straightforward. Let's say your textbox ID is tbDeliveryCost. Instead of using tbDeliveryCost.Focus(), do this:

string script = string.Format("$('#{0}').focus();", tbDeliveryCost.ClientID);
ScriptManager.RegisterStartupScript(this, this.GetType(), "SetFocus", script, true);