ASP.NET: Desplácese hasta el control

Question

Tengo una forma particularmente grande en una página. Cuando se valida el formulario y un campo no es válido, quiero desplazar la ventana hacia ese control. Llamar al foco del control() no parece hacer esto. He encontrado una solución alternativa de JavaScript para desplazar la ventana hacia el control, pero ¿hay algo incorporado en ASP.NET?

Answer 1

Usted debe mira en jQuery y el plugin de ScrollTo

http://demos.flesler.com/jquery/scrollTo/

Answer 2

Adición MaintainScrollPositionOnPostback es el más cercano que ASP.NET ha incorporado, pero no necesariamente saltar al campo (s) no válido.

<%@ Page MaintainScrollPositionOnPostback="true" %> 

Answer 3

¿Seguro Focus() no hará lo que usted describe? Bajo el capó, esencialmente está haciendo la "solución alternativa de JavaScript": escribe algunos JS en la página que llama a focus() en el control con el ID correspondiente:

Cualquiera que sea el control que Focus() haya llamado antes de que termine la página procesamiento escribe esto a la página:

<script type="text/javascript"> 
//<![CDATA[ 
WebForm_AutoFocus('txtFocus2');//]]> 
</script> 

Answer 4

que he logrado algo similar con HTML fragments básica. Que acaba de salir de un elemento con un ID conocida:

<span id="CONTROL-ID"></span> 

Y a continuación, ya sea a través de la escritura, en el lado del servidor cambiar la url:

window.location += "#CONTROL-ID"; 

En el primer caso, la página no se volverá a cargar, simplemente se desplazará hacia abajo hasta el control.

Answer 5

SO Creo que el problema se debe a que estaba tratando de centrarme en HtmlGenericControls en lugar de WebControls.

yo sólo terminé haciendo una solución con sede fuera de:

http://ryanfarley.com/blog/archive/2004/12/21/1325.aspx http://www.codeproject.com/KB/aspnet/ViewControl.aspx

... en aras del tiempo.

public static void ScrollTo(this HtmlGenericControl control) 
{ 
    control.Page.RegisterClientScriptBlock("ScrollTo", string.Format(@" 

     <script type='text/javascript'> 

      $(document).ready(function() {{ 
       var element = document.getElementById('{0}'); 
       element.scrollIntoView(); 
       element.focus(); 
      }}); 

     </script> 

    ", control.ClientID)); 
} 

Uso:

if (!this.PropertyForm.Validate()) 
{ 
    this.PropertyForm.ErrorMessage.ScrollTo(); 
    failed = true; 
} 

(Aunque parece Page.RegisterClientScriptBlock() está en desuso para Page.ClientScript.RegisterClientScriptBlock()).

Answer 6

¿Está utilizando un Resumen de validación en su página?

Si es así, ASP.NET renders some javascript to automatically scroll to the top of the page que bien puede anular el comportamiento automático de la validación del lado del cliente para enfocar el último control no válido.

Además, ¿ha desactivado la validación del lado del cliente?

Si se echa un vistazo al JavaScript generado por la validación del lado del cliente debería ver métodos como éste:

function ValidatorValidate(val, validationGroup, event) { 
    val.isvalid = true; 
    if ((typeof(val.enabled) == "undefined" || val.enabled != false) && 
     IsValidationGroupMatch(val, validationGroup)) { 
    if (typeof(val.evaluationfunction) == "function") { 
     val.isvalid = val.evaluationfunction(val); 
     if (!val.isvalid && Page_InvalidControlToBeFocused == null && 
      typeof(val.focusOnError) == "string" && val.focusOnError == "t") { 
     ValidatorSetFocus(val, event); 
     } 
    } 
    } 
    ValidatorUpdateDisplay(val); 
} 

Nota de la llamada a ValidatorSetFocus, que es un método bastante largo que intenta establecer el foco para el control en cuestión, o si tiene varios errores, hasta el último control que fue validada, usando (con el tiempo) las siguientes líneas:

if (typeof(ctrl.focus) != "undefined" && ctrl.focus != null) { 
    ctrl.focus(); 
    Page_InvalidControlToBeFocused = ctrl; 
} 

para conseguir este comportamiento a trabajar, lo ideal sería que asegurarse de que todos sus validadores están configurados t o ser del lado del cliente: los validadores del lado del servidor obviamente requerirán una devolución de datos, y eso podría afectar las cosas (es decir perder foco/posición) - y establecer MaintainScrollPositionOnPostBack en true probablemente haga que la página se vuelva a cargar al botón de enviar, en lugar de al elemento de formulario no válido.

Utilizando el lado del servidor. El método de enfoque causará que ASP.NET muestre javascript "en la carga de la página" (es decir, cerca de la parte inferior de la página) pero podría estar siendo anulado por uno de los otros mecanismos discutidos anteriormente .

Answer 7

solución muy simple es establecer la propiedad SetFocusOnError del RequiredFieldValidator (o el control de validación que está utilizando) a cierto

Answer 8

pegar el código JavaScript siguiente:

function ScrollToFirstError() { 
     Page_ClientValidate(); 
     if (Page_IsValid == false) { 
      var topMostValidator; 
      var lastOffsetTop; 
      for (var i = 0; i < Page_Validators.length; i++) { 
       var vld = Page_Validators[i]; 
       if (vld.isvalid == false) { 
        if (PageOffset(vld) < lastOffsetTop || lastOffsetTop == undefined) { 
         topMostValidator = vld; 
         lastOffsetTop = vld.offsetTop; 
        } 
       } 
      } 
      topMostValidator.scrollIntoView(); 
     } 
     return Page_IsValid; 
    } 

    function PageOffset(theElement) { 
     var selectedPosY = 0; 
     while (theElement != null) { 
      selectedPosY += theElement.offsetTop; 
      theElement = theElement.offsetParent; 
     } 
     return selectedPosY; 
    } 

A continuación, llame ScrollToFirstError() en su OnClientHaga clic en el botón que está guardando, asegúrese de que el botón tenga CausesValidation = true también.

Ahí lo tienes.

Answer 9

Page.MaintainScrollPositionOnPostBack = False 
Page.SetFocus(txtManagerName)