ASP.NET: прокрутка для контроля

Question

У меня особенно большая форма на странице. Когда форма проверена и поле недействительно, я хочу прокрутить окно до этого элемента управления. Вызов Focus () элемента управления, похоже, не делает этого. Я нашел обходной путь JavaScript для прокрутки окна к элементу управления, но есть ли что-то встроенное в ASP.NET?

Answer 1

Page.MaintainScrollPositionOnPostBack = False
Page.SetFocus(txtManagerName)

Answer 2

Используете ли вы Сводка проверки на своей странице?

Если это так, ASP.NET отображает некоторый javascript для автоматической прокрутки до верхней части страницы , что может отменить автоматическое поведение проверки на стороне клиента для фокусировки на последнем недействительном элементе управления.

Кроме того, вы выключили проверку на стороне клиента?

Если вы посмотрите на javascript, сгенерированный проверкой на стороне клиента, вы должны увидеть такие методы:

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

Обратите внимание на вызов ValidatorSetFocus, который является довольно длинным методом, который пытается установить фокус на рассматриваемом элементе управления или, если у вас есть несколько ошибок, на последний проверенный элемент управления, используя (в конце концов) следующие строки:

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

Чтобы заставить это поведение работать, в идеале вам нужно убедиться, что все ваши валидаторы установлены на стороне клиента - для валидаторов на стороне сервера, очевидно, потребуется обратная передача, и это может повлиять на вещи (то есть потерять фокус / позицию) - и установка для MaintainScrollPositionOnPostBack значения true, вероятно, приведет к перезагрузке страницы с кнопкой отправки, а не с недопустимым элементом формы.

Использование серверной стороны. Метод Focus приведет к тому, что ASP.NET отобразит некоторый javascript «при загрузке страницы» (т. Е. В нижней части страницы), но это может быть отменено одним из других механизмов, описанных выше.

Answer 3

Так что я считаю, что проблема в том, что я пытался сосредоточиться на HtmlGenericControls вместо WebControls.

Я только что сделал обходной путь, основанный на:

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

... в интересах времени.

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

Использование:

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

(хотя кажется, что Page.RegisterClientScriptBlock () устарела для Page.ClientScript.RegisterClientScriptBlock ()).

Answer 4

Очень простое решение состоит в том, чтобы установить для свойства SetFocusOnError RequiredFieldValidator (или любого используемого вами элемента проверки) значение true

Answer 5

Добавление MaintainScrollPositionOnPostback - самое близкое, что встроено в ASP.NET, но оно не обязательно перейдет на недопустимые поля.

<%@ Page MaintainScrollPositionOnPostback="true" %>

Answer 6

Вы уверены, что Focus () не будет делать то, что вы описываете? Под капотом он, по сути, делает «обходной путь JavaScript» - он записывает JS на страницу, которая вызывает focus () для элемента управления с соответствующим идентификатором:

Какой бы элемент управления ни вызывал Focus () в последний раз перед завершением обработки страницы, записывается на страницу:

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

Answer 7

Вставьте следующий Javascript:

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

Затем вызовите ScrollToFirstError () в вашем OnClientClick кнопки, которая сохраняет, убедитесь, что кнопка имеет также CausesValidation = true.

Вот, пожалуйста.

Answer 8

Я достиг чего-то подобного, используя базовые фрагменты HTML . Вы просто оставляете элемент с известным идентификатором:

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

А затем либо через скрипт, на стороне сервера измените URL:

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

В первом случае страница не будет перезагружаться, она просто прокрутится вниз до элемента управления.

Answer 9

Вы должны заглянуть в jQuery и плагин ScrollTo

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