ASP.Net 4.5 Twitter 引导和客户端验证
Posted
技术标签:
【中文标题】ASP.Net 4.5 Twitter 引导和客户端验证【英文标题】：ASP.Net 4.5 Twitter Bootstrap and Client Side Validation 【发布时间】：2012-09-22 09:50:03 【问题描述】：我在 Web 表单解决方案中使用新的 ASP.Net 4.5 进行了相当简单的设置。我已经使用 Twitter Bootstrap 将近一年了，真的很享受它为我节省的时间和它带来的一致性。他们的一些 javascript 方法也非常有用。但是，我在合并一些似乎需要在 4.5 中完成的“新方式”事情时遇到了问题。这是我的母版页：
<body>
<form id="frmMain" runat="server">
<asp:ScriptManager ID="smManager" runat="server">
<Scripts>
<asp:ScriptReference Name="jquery" />
<asp:ScriptReference Name="bootstrap" />
</Scripts>
</asp:ScriptManager>
...
这是一个测试页面的内容：
<asp:Content ID="Content2" ContentPlaceHolderID="cphMain" runat="server">
<asp:TextBox ID="txtTest" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="Problem" ControlToValidate="txtTest" CssClass="error" SetFocusOnError="True" ToolTip="Problem">*</asp:RequiredFieldValidator>
<asp:Button ID="btnTest" runat="server" Text="Check" CausesValidation="true" OnClick="btnTest_Click" /><br />
<asp:TextBox ID="txtAnother" runat="server"></asp:TextBox>
<asp:Button ID="btnOk" runat="server" CausesValidation="false" Text="No Check" />
</asp:Content>
这是我的 Global.asax.cs 文件，用于显示上述 ScriptReferences：
protected void Application_Start(object sender, EventArgs e)
GlobalConfiguration.Configuration.Formatters.JsonFormatter.SerializerSettings.ReferenceLoopHandling = Newtonsoft.Json.ReferenceLoopHandling.Ignore;
ScriptManager.ScriptResourceMapping.AddDefinition(
"jquery",
new ScriptResourceDefinition
Path = "~/Scripts/jquery-1.8.2.min.js",
DebugPath = "~/Scripts/jquery-1.8.2.js",
CdnPath = "http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js",
CdnDebugPath = "http://ajax.microsoft.com/ajax/jQuery/jquery-1.8.2.js",
LoadSuccessExpression = "window.jQuery"
); // Load jQuery
ValidationSettings.UnobtrusiveValidationMode = UnobtrusiveValidationMode.WebForms;
ScriptManager.ScriptResourceMapping.AddDefinition(
"bootstrap",
new ScriptResourceDefinition
Path = "~/Scripts/bootstrap.min.js",
DebugPath = "~/Scripts/bootstrap.js"
); // Load Bootstrap
客户端检查第一个文本框没有触发。如果我单击“检查”按钮，它会进行往返，并且代码隐藏的 Page.IsValid == false。这很好，但我不想在页面无效时发回。
我创建了另一个测试页，它没有使用我的母版页，但其中包含相同的代码，如下所示：
<form id="form1" runat="server">
<div>
<asp:TextBox ID="txtTest" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="Problem" ControlToValidate="txtTest" CssClass="error" SetFocusOnError="True" ToolTip="Problem">*</asp:RequiredFieldValidator>
<asp:Button ID="btnTest" runat="server" Text="Check" OnClick="btnTest_Click" /><br />
<asp:TextBox ID="txtAnother" runat="server"></asp:TextBox>
<asp:Button ID="btnOk" runat="server" CausesValidation="false" OnClick="btnOk_Click" Text="No Check" />
</div>
</form>
这个页面抛出了客户端，因此我希望它停止发回。
在我看来，bootstrap.js 可能正在拖拽或中断标准 js 验证。有什么建议我仍然可以使用引导程序吗？我需要 bootstrap.js 文件，因为它处理下拉菜单。我至少可以将 jQuery 的 UI 用于模态框，但这对下拉菜单没有帮助。
我想使用新技术，但我们总是有这些学习曲线。
【问题讨论】：
【参考方案1】：您可以在这里选择您真正需要的插件：http://twitter.github.com/bootstrap/customize.html#plugins 我认为 bootstrap.js 包含多合一的组合解决方案。所以你可以尝试只使用你需要的东西，看看它是否有帮助
【讨论】：
以上是关于ASP.Net 4.5 Twitter 引导和客户端验证的主要内容，如果未能解决你的问题，请参考以下文章
如何使用 ASP.NET 4.5 捆绑和 CDN 来获取 Bootstrap 3.2？
如何将 JQuery Datatable.net 与 ASP.Net 4 Razor 和 Twitter Bootstrap 一起使用