1

我有一个很长的表格需要填写。我启用了维护ScrollPositionOnPostBack，因为我有多个基于用户输入隐藏/显示的控件。

由于表单很长，我希望页面聚焦并滚动到导致验证失败的第一个控件，并且我启用了对验证失败选项的关注。但是，maintainScrollPositionOnPostBack 似乎覆盖了它（控件确实聚焦但不向上滚动）。

对此有任何解决方法的想法吗？到目前为止我所尝试的一切都没有奏效。这是一个 asp.net 网络表单项目。

4

1 回答 1

0

这是一个很好的问题，而且很难开始工作。但我设法获得了一个版本，您可以尝试并在此基础上进行构建。

MaintainScrollPositionOnPostback="true" 设置在表单提交和窗口加载时设置了一系列 javascript 事件，这些事件如您所说，“覆盖”验证器设置的焦点。

所以我所做的就是为所有验证器添加一个通用的 css 类，如下所示：

<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" CssClass="error" ErrorMessage="RequiredFieldValidator" SetFocusOnError="true"
    EnableClientScript="false" ControlToValidate="TextBox1"></asp:RequiredFieldValidator>

然后我在 window.load 中添加了另一个事件监听器（请注意，我们还需要保留 Asp.Net 添加的那个，所以我们不能执行 windows.load = function...）：

<script>
    window.addEventListener("load", function () {
        var el = document.getElementsByClassName("error");
        if (el.length > 0) {
            window.location.hash = "#" + el[0].id;                
        }
    });        
</script>

在这里，您可能会受益于使用 jQuery 来支持更多浏览器，但 addEventListener 得到了很好的支持。

该脚本搜索错误消息并通过它的 id 和锚来关注它。Javascript 有焦点方法，但它是针对表单元素的，所以这就是这个解决方法的原因。

希望这可以帮助！

于 2016-07-07T08:53:19.453 回答