使用Masterpage在ASP.Net页面上进行JavaScript验证的最佳方法是什么？

Question

我正在母版页内的ASP.Net页上实现Javascript验证。 控件ID正在更改，因此我无法使用原始控件ID进行验证。 我在网上查看了有关动态创建脚本的建议，并使用RegisterStartupScript将其添加到页面中。 我不喜欢这种解决方案，因为它无法维护。

我可以在此页面上执行javascript验证并安排客户端ID的方式有哪些？

另一个解决方案只是要求我继续使用浏览器中显示的最终clientID。 这是可行的，我希望它在运行时创建脚本。 你怎么看？

Answer 1

IMO，复制最终出现在浏览器中的ClientID值很难等待。 如果您在代码中更改了控件ID，却忘记了在JavaScript中进行更改，则直到验证神秘地停止工作时，您才会注意到。 通过动态构建它，您至少将获得编译时错误的好处。

当我需要使用javascript访问控件的客户端ID时，将脚本块放在页面顶部：

<script>
    var SomeControl = <%= Control1.ClientID %>;
    var AnotherControl = <%= Control2.ClientID %>;
    // etc, etc.
</script>

不幸的是，它仍然感觉很丑陋。 将来的ASP.NET版本可能会解决此问题。

Answer 2

最佳解决方案取决于您的实际情况。 使用Asp.Net表单进行验证的最简单，最可维护的方法是使用内置的验证控件。 它们采用您要验证的控件的ID，然后在该控件上同时提供客户端（javascript）和服务器端验证。 他们为您处理自动接线和JavaScript创建。

如果由于某些原因这些方法不起作用，并且您想用javascript编写自己的验证函数，那么您将需要使用类似于上述Brant解决方案的方法。 正如布兰特所说，使用

<%= Control1.ClientID%>

您的javascript中的优于从浏览器源复制最终呈现的控件ID，因为控件的最终ID会根据多种因素而变化，包括控件的ID和可能嵌套在其下的任何父控件的ID（用户控件，网格，中继器等）。 .ClientID将针对每种情况输出控件的最终呈现ID。 这项技术看似很脏，但实际上是一种非常干净的方法，用于处理框架中内置的ID重写以防止命名冲突。 这是许多网站上使用的标准技术。

Answer 3

通过内联代码（例如<％％>标记）引用ClientID是完全可以接受的。 但是，给出的示例将无法真正起作用。 您需要访问DOM ...

<script language="javascript" type="text/javascript">
  var control = document.getElementById('<%= control.ClientID %>');
</script>

Answer 4

另一种方法（不是性能较高的方法）是使用JQuery。

在要查找的每个控件中放置一个自定义CSS类。 如果是文本框，则可能如下所示：

< asp:TextBox id="NameTextBox" runat="server" cssClass="NameTextBox" >

这应该在浏览器中这样显示：

< input id="something_NameTextBox" type="text" class="NameTextBox" >

然后，使用JQuery，您可以找到如下所示的控件：

$(".NameTextBox")

您可以使用以下命令获取文本框的值： $(".NameTextBox").val()

这不是很有效，通过控件的ID查找控件的速度更快，但是如果页面不太大，则可以正常工作。

Answer 5

js代码有两件事需要满足：1.在方便的JS编辑器中编辑JS代码。 （例如，VS）2.确保多个控件实例共存。

有一种通用的方法可以提供这两件事：分开

• 独立于客户端ID的通用代码
• 取决于具体ID的代码。

如果计划很少更改，则通用代码可以存储为.js文件或Web资源。 依赖ID的代码可以按照Brant的答案进行排列，例如

   <script>
       var <%=c1.ClientID %> = new SomeJsClass(<%=c1.ClientID %>);
       var <%=c2.ClientID %> = document.getElementById('<%=c1.ClientID %>');
   </script>

处理这些变量的代码可能位于单独的.js文件中。

Answer 6

这是我使用的2种方法：

在主人：

Page.ClientScript.RegisterClientScriptInclude("somescript", ResolveUrl("some.js"));

以编程方式：

HtmlGenericControl JScript1 = new HtmlGenericControl("script");
JScript1.Attributes.Add("type", "text/javascript");
JScript1.Attributes.Add("src", ResolveUrl("some.js"));
this.Page.Header.Controls.Add(JScript1);