Todos nos habremos encontrado que cuando hacemos un PostBack con los UpdatePanel de Microsoft, nos encontramos que se nos deslocaliza el focus.
Esto nos provoca que tengamos que estar colocando el foco en el siguiente control, ¿pero qué pasa cuándo el foco, no lo tiene el siguiente tabindex?
Para solucionarlo, solo hay que colocar el siguiente JScript en nuestro código, para que te guarde el control que tenía el foco antes del postback. Para ello deberemos colocarlo dentro del ScriptManager como se muestra a final de esta entrada
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;
}
targetControl.focus();
if (focusTarget) {
focusTarget.contentEditable = oldContentEditableSetting;
}
}
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);
<
asp:ScriptManager runat="server" ID="ScriptManager1" >
<Scripts>
<asp:ScriptReference Path="~/Script/UpdatePanelFocus.js" />
</Scripts>
</asp:ScriptManager>