Gra*_*zer 5 asp.net jquery client-side-validation twitter-bootstrap
我在Web Forms解决方案中使用新的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的任何建议？我需要bootstrap.js文件,因为它处理下拉菜单.我至少可以使用jQuery的UI作为模态,但这对下拉有帮助.
我想使用新技术,但我们总是有这些学习曲线.
您可以在这里选择您真正需要的插件：http://twitter.github.com/bootstrap/customize.html#plugins 我认为 bootstrap.js 包含一体化的组合解决方案。因此，您可以尝试仅使用您需要的内容，看看是否有帮助