如何在服务器端验证后将焦点设置到元素上 - MVC 3

Question

大家早上好。

由于某种原因，我在一个模型的下拉列表中添加了一层服务器端验证：

 public IEnumerable<ValidationResult> Validate(ValidationContext validationContext)
    {
        if (SomethingVisible && DropDownListSelection == 0)
        {
            yield return new ValidationResult("Please make a selection", new[] { "DropDownListSelectionId"});
        }
    }


<div class="editor-field">
                            @Html.DropDownListFor(x => x.DropDownListSelectionId, new SelectList(Model.DropDownListSelection, "DropDownListSelectionId", "DropDownListSelectionName"))
                            <br />
                            @Html.ValidationMessageFor(model => model.DropDownListSelectionId)
                        </div>

这很好地显示了适当的验证错误，当!Model.IsValid时也能正常工作。太棒了。

然而，由于某些表单可能会很高（我知道，我知道，很糟糕），而且这种验证可能会消失，即您必须向下滚动才能看到验证错误，因此有些人不喜欢滚动。

因此，我想使用jquery / javascript来设置焦点在被验证的元素上，我该怎么做？

对于这个问题，非常抱歉。

- Ricardo Deano

Answer 1

$(function(){
    $('input, select, textarea').each(function(){
         if($(this).hasClass('input-validation-error'))
              $(this).focus();
    });
});

- karaxuna

Answer 2

每次加载表单时，我通常要做的事情是检查是否有任何带有“validation”类的元素，并将焦点设置在该类的第一个出现位置。在大多数浏览器中，它应该会自动滚动到聚焦的元素。

- KyorCode