У меня есть приложение MVC, использующее xVal. Я пытаюсь подключиться к проверке jquery, чтобы показать графику «загрузка», когда форма станет действительной. Кажется, я не могу найти способ показать qraphic только тогда, когда jquery подтвердил форму.
Однако он также отключает кнопку при нажатии кнопки и НЕ проверяется, не позволяя пользователю повторно отправить форму после исправления ошибок на стороне клиента.
У кого-нибудь есть опыт этого.
Спасибо
R
Вот источник всей страницы
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>
</title><link href="../Content/wri_mainstyles.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/Scripts/jquery-1.3.js"></script>
<script type="text/javascript" src="/Scripts/jquery.validate.js"></script>
<script type="text/javascript" src="/Scripts/xVal.jquery.validate.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// ---- notification pane
$("#notify-container").fadeOut(4000);
// ---- tab bar related code
var sel;
$("#nav a").mouseover(function() {
if ($(this).data("clicked")) { return; }
$(this).children("img").each(function() {
this.src = $(this).attr("src").replace(/_off\.gif$/ig, "_on.gif");
});
}).mouseout(function() {
if ($(this).data("clicked")) { return; }
$(this).children("img").each(function() {
this.src = $(this).attr("src").replace(/_on\.gif$/ig, "_off.gif");
});
//handle clicks
}).click(function() {
if (sel != null) {
$("#nav").find("img").each(function() {
this.src = this.src.replace(/_clk\.gif$/i, "_off.gif");
});
}
$(this).children("img").each(function() {
this.src = $(this).attr("src").replace(/_on.gif$/ig, "_clk.gif");
})
sel = this;
});
//panel pop up code
//hide panel on load.
$("#top-panel").hide();
//toggle when clicked.
$("#sub-panel").click(function() {
$("#top-panel").slideToggle();
var el = $("#shText");
var state = $("#shText").html();
state = (state == 'Close Panel' ? '<span id="shText">Open Panel</span>' : '<span id="shText">Close Panel</span>');
el.replaceWith(state);
});
});
</script>
<script type="text/javascript" language="javascript">
$(function() { // make this code initialize when DOM loads
$('#frmXL').submit(function() {
$('input[type="submit"]', this).replaceWith('<span id="loading"></span>'); //
});
});
</script>
</head>
<body>
<div class="wrapper">
<div id="nav">
<div id="logo"><img src="../../Content/Images/inbox_wrilogo.gif" width="143" height="28" alt="logo" border="0" /></div>
<div id="tab1"><a href="/Support"><img alt="Support" border="0" height="22" name="support" src="/Content/Images/nav_support_off.gif" width="75"></img></a></div>
<div id="tab2"><a href="/Account"><img alt="Account" border="0" height="22" name="account" src="/Content/Images/nav_acct_off.gif" width="75"></img></a></div>
<div id="tab3"><a href="/"><img alt="Inbox" border="0" height="22" name="inbox" src="/Content/Images/nav_inbox_off.gif" width="75"></img></a></div>
</div>
<form action="/Security/Login?ReturnUrl=%2f" id="frmXL" method="post">
<div id="loginwrapper">
<div id="logincontainer">
<div id="logincontrol">
<p>
<label for="username" accesskey="u">Email Address</label>
<input class="frmInput" id="EmailAddress" name="EmailAddress" type="text" value="" />
</p>
<p>
<label for="password" accesskey="p">Password</label>
<input class="frmInput" id="Password" name="Password" type="password" />
</p>
<label for="RememberMe">Remember Me</label>
<div id="rememberwrapper">
<span class="rememberme"><input id="RememberMe" name="RememberMe" type="checkbox" value="true" /><input name="RememberMe" type="hidden" value="false" /></span>
</div>
<p>
<input class="frmbtnsubmit" type="submit" value="Login" />
</p>
</div>
<span class="homelink">
<a class="hmlink" href="/Security?Length=4">Back to Homepage</a>
</span>
</div>
</div>
</form><input name="__RequestVerificationToken" type="hidden" value="DolZ3JoPXziTgPTvWZLqxl/2z16aolj3gjZzHeB2cbs0a+6O17w9bWm3K9XOS/GX" />
<script type="text/javascript">xVal.AttachValidator(null, {"Fields":[{"FieldName":"EmailAddress","FieldRules":[{"RuleName":"RegEx","RuleParameters":{"Pattern":"^(?:[a-zA-Z0-9_\u0027^&/+-])+(?:\\.(?:[a-zA-Z0-9_\u0027^&/+-])+)*@(?:(?:\\[?(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?))\\.){3}(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\\]?)|(?:[a-zA-Z0-9-]+\\.)+(?:[a-zA-Z]){2,}\\.?)$"},"Message":"Email address is invalid."},{"RuleName":"Required","RuleParameters":{},"Message":"This is a required field."},{"RuleName":"RegEx","RuleParameters":{"Pattern":"^(?:[a-zA-Z0-9_\u0027^&/+-])+(?:\\.(?:[a-zA-Z0-9_\u0027^&/+-])+)*@(?:(?:\\[?(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?))\\.){3}(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\\]?)|(?:[a-zA-Z0-9-]+\\.)+(?:[a-zA-Z]){2,}\\.?)$"},"Message":"Email address is invalid."},{"RuleName":"Required","RuleParameters":{},"Message":"This is a required field."}]},{"FieldName":"Password","FieldRules":[{"RuleName":"Required","RuleParameters":{},"Message":"This is a required field."},{"RuleName":"Required","RuleParameters":{},"Message":"This is a required field."}]}]})</script>
</div>
<!-- RDD: Do not remove this div. This help keep the footer at the bottom of the page -->
<div class="push"></div>
<!-- end -->
<div id="top-panel">
<span id="appversion" class="footertext">Inbox Swf Version: 0.0.0.1<br />Web Application Version: 0.0.75.12305</span>
</div>
<div id="#footercontent">
<div class="footer">
<div id="footertext">© Copyright 2009 All Rights Reserved</div>
<div id="sub-panel"><a title="View support panel" href="#" id="toggle"><span id="shText">Open Panel</span></a></div>
</div>
</div>
</body>
</html>
submitобработчик событий срабатывает раньше, чем xVal, и в этом случае ... ну, вы уже обнаружили эту часть! - person Funka schedule 05.09.2009