¿Cómo puedo mantener la posición de foco en UpdatePanel después de la publicación parcial de página atrás

Question

Tengo cuatro controles en una página con el panel de actualización. Inicialmente, el enfoque del mouse se establece en el primer control. Cuando publico parcialmente la página en el servidor, el foco se mueve automáticamente al primer control desde el último control enfocado desde el control al que he tabulado. ¿Hay alguna forma de mantener el último foco?

Answer 1

Tome un vistazo a Restoring Lost Focus in the Update Panel with Auto Post-Back Controls:

La idea básica detrás de la solución es guardar el ID del control con el foco de entrada antes de que se actualice el panel de actualización y ajuste de entrada centrarse de nuevo a ese control después el panel de actualización está actualizado.

Vengo con el siguiente JavaScript que restaura el foco perdido en el panel de actualización.

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); 

Answer 2

Me parece más elegante:

(function(){ 
    var focusElement; 
    function restoreFocus(){ 
     if(focusElement){ 
      if(focusElement.id){ 
       $('#'+focusElement.id).focus(); 
      } else { 
       $(focusElement).focus(); 
      } 
     } 
    } 

    $(document).ready(function() { 
     $(document).on('focusin', function(objectData){ 
      focusElement = objectData.currentTarget.activeElement; 
     }); 
     Sys.WebForms.PageRequestManager.getInstance().add_endRequest(restoreFocus); 
    }); 
})();