将超链接添加到ValidationSummary [英] Adding Hyperlinks to ValidationSummary

问题描述

我有一张很长的表格供用户填写.有没有办法将ValidationSummary中的错误消息超链接到特定的文本字段?

I have a long form for my users to fill out. Is there a way to hyperlink the error message in ValidationSummary to the specific text field?

推荐答案

我以前以@jdmonty建议的相同方式实现了这一点-通过将锚标记添加到每个RFV的ErrorMessage属性中来实现.最终，我发现这太乏味了，所以我鼓起了一些jQuery为我完成这项工作.此摘要将使用 href =#targetControl 将您的验证消息包装在锚定标记中，当然，单击该标记时，滚动到目标输入即可.

I've implemented this before in the same way @jdmonty had suggested - by adding the anchor tags to each RFV's ErrorMessage attribute. Eventually I found this too tedious so I drummed up some jQuery to do the work for me. This snippet will wrap your validation messages in anchor tags with the href=#targetControl, which of course when clicked scrolls to the target input.

将此添加到$(document).ready();中.脚本代码的一部分.

Add this to the $(document).ready(); portion of your script code.

   var validators = Page_Validators;   // returns collection of validators on page

        $(validators).each(function () {
            //get target control and current error validation message from each validator
            var errorMsg = $(this).context.errormessage;
            var targetControl = $(this).context.controltovalidate;
            var errorMsgWithLink = "<a href='#" + targetControl + "'> " + errorMsg + "</a>";

            //update error message with anchor tag
            $(this).context.errormessage = errorMsgWithLink;
        });

您可以添加一些其他的jQuery，如@jdmonty所建议的，以平滑滚动.您还可以在样式表中使用css伪类:focus"为活动"输入文本框添加样式，例如 input [type = text]:focus {background-color:red;} 当他们专注时会真正突出.

You could add some additional jQuery as @jdmonty suggested to smooth the scrolling. You can also use the css pseudo class ':focus' in your style sheet to add styles for 'active' input textboxes, something like input[type=text]:focus{background-color:red;} to really accentuate when they are focused.

P.S.我知道这个问题很旧，但是今天我才发现它，同时看看是否有人想出一个更优雅的解决方案，所以对于我鞋中的其他人来说，可以.

P.S. I know this question is old but I just found it today while seeing if anyone had come up with a more elegant solution, so for anyone else in my shoes, here ya go.

这篇关于将超链接添加到ValidationSummary的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！