ASP.NET: Cuộn để điều khiển

Question

Tôi có một biểu mẫu đặc biệt lớn trong một trang. Khi biểu mẫu được xác thực và một trường không hợp lệ, tôi muốn cuộn cửa sổ đến điều khiển đó. Gọi Focus của điều khiển() dường như không làm điều này. Tôi đã tìm thấy một cách giải quyết JavaScript để di chuyển cửa sổ để kiểm soát, nhưng có bất cứ điều gì được xây dựng vào ASP.NET?

Answer 1

Bạn nên nhìn vào jQuery và ScrollTo Plugin

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

Answer 2

Thêm MaintainScrollPositionOnPostback là gần nhất mà ASP.NET đã được xây dựng trong, nhưng sẽ không nhất thiết phải nhảy vào lĩnh vực không hợp lệ (s).

<%@ Page MaintainScrollPositionOnPostback="true" %> 

Answer 3

Bạn có chắc chắn Focus() sẽ không làm những gì bạn mô tả? Dưới mui xe, về cơ bản nó thực hiện giải pháp "JavaScript" - nó viết một số JS tới trang gọi trọng tâm() trên điều khiển với ID phù hợp:

Điều khiển nào có tiêu điểm() được gọi trước khi trang kết thúc xử lý ghi điều này vào trang:

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

Answer 4

Tôi đã đạt được điều gì đó tương tự bằng cách sử dụng cơ bản HTML fragments. Bạn chỉ cần để lại một phần tử với một ID được biết:

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

Và sau đó, hoặc thông qua kịch bản, vào ở phía máy chủ thay đổi url:

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

Trong trường hợp đầu tiên trang sẽ không tải lại, nó sẽ chỉ cuộn xuống phần điều khiển.

Answer 5

Vì vậy, tôi tin rằng vấn đề là vì tôi đã cố gắng tập trung vào HtmlGenericControls thay vì WebControls.

Tôi vừa kết thúc lên làm một workaround dựa tắt của:

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

... vì lợi ích của thời gian.

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

Cách sử dụng:

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

(Mặc dù nó xuất hiện Page.RegisterClientScriptBlock() không được dùng cho Page.ClientScript.RegisterClientScriptBlock()).

Answer 6

Bạn đang sử dụng Tóm tắt xác thực trên trang của mình phải không?

Nếu vậy, ASP.NET renders some javascript to automatically scroll to the top of the page cũng có thể ghi đè hành vi tự động của xác thực phía máy khách để tập trung điều khiển không hợp lệ cuối cùng.

Ngoài ra, bạn đã tắt xác thực bên phía khách hàng chưa?

Nếu bạn có một cái nhìn tại javascript tạo ra bởi các xác nhận phía khách hàng mà bạn sẽ thấy phương pháp như thế này:

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

Lưu ý các cuộc gọi đến ValidatorSetFocus, mà là một phương pháp khá dài mà cố gắng để thiết lập focus để kiểm soát trong câu hỏi, hoặc nếu bạn có nhiều sai sót, để kiểm soát cuối cùng đã được xác nhận, sử dụng (cuối cùng) dòng sau:

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

để có được hành vi này để làm việc, bạn sẽ lý tưởng cần phải đảm bảo rằng tất cả các trình xác thực của bạn được đặt t o là phía máy khách - trình xác thực bên máy chủ rõ ràng sẽ yêu cầu đăng lại và điều đó có thể ảnh hưởng đến mọi thứ (tức là mất tập trung/vị trí) - và thiết lập MaintainScrollPositionOnPostBack true có lẽ sẽ gây ra trang để tải lại vào nút gửi, chứ không phải là yếu tố hình thức không hợp lệ.

Sử dụng phía máy chủ.Focus method sẽ khiến ASP.NET hiển thị một số javascript "trên trang tải" (tức là gần cuối trang) nhưng điều này có thể bị tràn ngập bởi một trong các cơ chế khác được nêu trên .

Answer 7

giải pháp Rất đơn giản là để thiết lập thuộc tính SetFocusOnError của RequiredFieldValidator (hoặc bất cứ sự kiểm soát validator bạn đang sử dụng) là true

Answer 8

Dán javascript sau:

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

Sau đó gọi ScrollToFirstError() trong bạn OnClientClick của nút đó là tiết kiệm, đảm bảo các nút có CausesValidation = true là tốt.

Ở đó bạn có nó.

Answer 9

Page.MaintainScrollPositionOnPostBack = False 
Page.SetFocus(txtManagerName)